fix: input clear error (#7523)

pull/7534/head
hippo 2024-04-25 09:29:38 +08:00 committed by GitHub
parent d6cc262c3a
commit 8e8073d17e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 10 additions and 10 deletions

View File

@ -15,7 +15,7 @@ import {
triggerFocus, triggerFocus,
} from './utils/commonUtils'; } from './utils/commonUtils';
import BaseInput from './BaseInput'; import BaseInput from './BaseInput';
import BaseInputCore from '../_util/BaseInput'; import BaseInputCore, { type BaseInputExpose } from '../_util/BaseInput';
export default defineComponent({ export default defineComponent({
name: 'VCInput', name: 'VCInput',
@ -24,7 +24,7 @@ export default defineComponent({
setup(props, { slots, attrs, expose, emit }) { setup(props, { slots, attrs, expose, emit }) {
const stateValue = shallowRef(props.value === undefined ? props.defaultValue : props.value); const stateValue = shallowRef(props.value === undefined ? props.defaultValue : props.value);
const focused = shallowRef(false); const focused = shallowRef(false);
const inputRef = shallowRef<HTMLInputElement>(); const inputRef = shallowRef<BaseInputExpose>();
const rootRef = shallowRef<ComponentPublicInstance>(); const rootRef = shallowRef<ComponentPublicInstance>();
watch( watch(
() => props.value, () => props.value,
@ -42,12 +42,12 @@ export default defineComponent({
); );
const focus = (option?: InputFocusOptions) => { const focus = (option?: InputFocusOptions) => {
if (inputRef.value) { if (inputRef.value) {
triggerFocus(inputRef.value, option); triggerFocus(inputRef.value.input, option);
} }
}; };
const blur = () => { const blur = () => {
inputRef.value?.blur(); inputRef.value.input?.blur();
}; };
const setSelectionRange = ( const setSelectionRange = (
@ -55,17 +55,17 @@ export default defineComponent({
end: number, end: number,
direction?: 'forward' | 'backward' | 'none', direction?: 'forward' | 'backward' | 'none',
) => { ) => {
inputRef.value?.setSelectionRange(start, end, direction); inputRef.value.input?.setSelectionRange(start, end, direction);
}; };
const select = () => { const select = () => {
inputRef.value?.select(); inputRef.value.input?.select();
}; };
expose({ expose({
focus, focus,
blur, blur,
input: computed(() => (inputRef.value as any)?.input), input: computed(() => (inputRef.value.input as any)?.input),
stateValue, stateValue,
setSelectionRange, setSelectionRange,
select, select,
@ -81,7 +81,7 @@ export default defineComponent({
stateValue.value = value; stateValue.value = value;
} else { } else {
nextTick(() => { nextTick(() => {
if (inputRef.value.value !== stateValue.value) { if (inputRef.value.input.value !== stateValue.value) {
rootRef.value?.$forceUpdate(); rootRef.value?.$forceUpdate();
} }
}); });
@ -94,7 +94,7 @@ export default defineComponent({
const { value } = e.target as any; const { value } = e.target as any;
if (stateValue.value === value) return; if (stateValue.value === value) return;
const newVal = e.target.value; const newVal = e.target.value;
resolveOnChange(inputRef.value, e, triggerChange); resolveOnChange(inputRef.value.input as HTMLInputElement, e, triggerChange);
setValue(newVal); setValue(newVal);
}; };
@ -116,7 +116,7 @@ export default defineComponent({
}; };
const handleReset = (e: MouseEvent) => { const handleReset = (e: MouseEvent) => {
resolveOnChange(inputRef.value, e, triggerChange); resolveOnChange(inputRef.value.input as HTMLInputElement, e, triggerChange);
setValue('', () => { setValue('', () => {
focus(); focus();
}); });