diff --git a/components/form/Form.tsx b/components/form/Form.tsx index 250a7b190..a78d18969 100755 --- a/components/form/Form.tsx +++ b/components/form/Form.tsx @@ -93,7 +93,7 @@ export type FormExpose = { resetFields: (name?: NamePath) => void; clearValidate: (name?: NamePath) => void; validateFields: ( - nameList?: NamePath[], + nameList?: NamePath[] | string, options?: ValidateOptions, ) => Promise<{ [key: string]: any; @@ -102,7 +102,7 @@ export type FormExpose = { [key: string]: any; }; validate: ( - nameList?: NamePath[], + nameList?: NamePath[] | string, options?: ValidateOptions, ) => Promise<{ [key: string]: any; diff --git a/components/form/FormItem.tsx b/components/form/FormItem.tsx index 3989f15bd..63927a1b0 100644 --- a/components/form/FormItem.tsx +++ b/components/form/FormItem.tsx @@ -1,4 +1,4 @@ -import type { PropType, ExtractPropTypes, ComputedRef } from 'vue'; +import type { PropType, ExtractPropTypes, ComputedRef, Ref } from 'vue'; import { watch, defineComponent, @@ -32,7 +32,7 @@ const ValidateStatuses = tuple('success', 'warning', 'error', 'validating', ''); export type ValidateStatus = typeof ValidateStatuses[number]; export interface FieldExpose { - fieldValue: ComputedRef; + fieldValue: Ref; fieldId: ComputedRef; fieldName: ComputedRef; resetField: () => void; @@ -132,13 +132,21 @@ export default defineComponent({ return formName ? `${formName}_${mergedId}` : `${defaultItemNamePrefixCls}_${mergedId}`; } }); - const fieldValue = computed(() => { + const getNewFieldValue = () => { const model = formContext.model.value; if (!model || !fieldName.value) { return; + } else { + return getPropByPath(model, namePath.value, true).v; } - return getPropByPath(model, namePath.value, true).v; - }); + }; + const fieldValue = ref(getNewFieldValue()); + watchEffect( + () => { + fieldValue.value = getNewFieldValue(); + }, + { flush: 'post' }, + ); const initialValue = ref(cloneDeep(fieldValue.value)); const mergedValidateTrigger = computed(() => {