perf(BasicForm): fix invaild defaultValue && split-setdefault-setvalue (#3815)
This commit is contained in:
parent
4348d21da8
commit
88e77dbf99
|
|
@ -207,6 +207,7 @@
|
||||||
removeSchemaByField,
|
removeSchemaByField,
|
||||||
resetFields,
|
resetFields,
|
||||||
scrollToField,
|
scrollToField,
|
||||||
|
resetDefaultField,
|
||||||
} = useFormEvents({
|
} = useFormEvents({
|
||||||
emit,
|
emit,
|
||||||
getProps,
|
getProps,
|
||||||
|
|
@ -305,6 +306,7 @@
|
||||||
validate,
|
validate,
|
||||||
submit: handleSubmit,
|
submit: handleSubmit,
|
||||||
scrollToField: scrollToField,
|
scrollToField: scrollToField,
|
||||||
|
resetDefaultField,
|
||||||
};
|
};
|
||||||
|
|
||||||
const getFormActionBindProps = computed(
|
const getFormActionBindProps = computed(
|
||||||
|
|
|
||||||
|
|
@ -121,6 +121,9 @@ export function useForm(props?: Props): UseFormReturnType {
|
||||||
const form = await getForm();
|
const form = await getForm();
|
||||||
return form.validateFields(nameList);
|
return form.validateFields(nameList);
|
||||||
},
|
},
|
||||||
|
resetDefaultField:async (nameList?: NamePath[]) => {
|
||||||
|
unref(formRef)?.resetDefaultField(nameList);
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
return [register, methods];
|
return [register, methods];
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@ import type { ComputedRef, Ref } from 'vue';
|
||||||
import type { FormProps, FormSchemaInner as FormSchema, FormActionType } from '../types/form';
|
import type { FormProps, FormSchemaInner as FormSchema, FormActionType } from '../types/form';
|
||||||
import type { NamePath } from 'ant-design-vue/lib/form/interface';
|
import type { NamePath } from 'ant-design-vue/lib/form/interface';
|
||||||
import { unref, toRaw, nextTick } from 'vue';
|
import { unref, toRaw, nextTick } from 'vue';
|
||||||
import { isArray, isFunction, isObject, isString, isDef, isNil } from '@/utils/is';
|
import { isArray, isFunction, isObject, isString, isNil } from '@/utils/is';
|
||||||
import { deepMerge } from '@/utils';
|
import { deepMerge } from '@/utils';
|
||||||
import { dateItemType, defaultValueComponents, isIncludeSimpleComponents } from '../helper';
|
import { dateItemType, defaultValueComponents, isIncludeSimpleComponents } from '../helper';
|
||||||
import { dateUtil } from '@/utils/dateUtil';
|
import { dateUtil } from '@/utils/dateUtil';
|
||||||
|
|
@ -110,15 +110,37 @@ export function useFormEvents({
|
||||||
}
|
}
|
||||||
validKeys.push(key);
|
validKeys.push(key);
|
||||||
} else {
|
} else {
|
||||||
// key not exist
|
// key not exist
|
||||||
if (isDef(get(defaultValueRef.value, key))) {
|
// refer:https://github.com/vbenjs/vue-vben-admin/issues/3795
|
||||||
unref(formModel)[key] = cloneDeep(unref(get(defaultValueRef.value, key)));
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
validateFields(validKeys).catch((_) => {});
|
validateFields(validKeys).catch((_) => {});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description: Set form default value
|
||||||
|
*/
|
||||||
|
function resetDefaultField(nameList?: NamePath[]) {
|
||||||
|
if(!Array.isArray(nameList)){
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (Array.isArray(nameList) && nameList.length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const validKeys: string[] = [];
|
||||||
|
let keys = Object.keys(unref(formModel))
|
||||||
|
if(!keys){
|
||||||
|
return
|
||||||
|
}
|
||||||
|
nameList.forEach((key:any) => {
|
||||||
|
if(keys.includes(key)){
|
||||||
|
validKeys.push(key);
|
||||||
|
unref(formModel)[key] = cloneDeep(unref(get(defaultValueRef.value, key)));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
validateFields(validKeys).catch((_) => {});
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @description: Delete based on field name
|
* @description: Delete based on field name
|
||||||
*/
|
*/
|
||||||
|
|
@ -359,6 +381,7 @@ export function useFormEvents({
|
||||||
resetFields,
|
resetFields,
|
||||||
setFieldsValue,
|
setFieldsValue,
|
||||||
scrollToField,
|
scrollToField,
|
||||||
|
resetDefaultField
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -135,7 +135,7 @@ export function useFormValues({
|
||||||
const schemas = unref(getSchema);
|
const schemas = unref(getSchema);
|
||||||
const obj: Recordable = {};
|
const obj: Recordable = {};
|
||||||
schemas.forEach((item) => {
|
schemas.forEach((item) => {
|
||||||
const { defaultValue, defaultValueObj } = item;
|
const { defaultValue, defaultValueObj, componentProps={} } = item;
|
||||||
const fieldKeys = Object.keys(defaultValueObj || {});
|
const fieldKeys = Object.keys(defaultValueObj || {});
|
||||||
if (fieldKeys.length) {
|
if (fieldKeys.length) {
|
||||||
fieldKeys.forEach((field) => {
|
fieldKeys.forEach((field) => {
|
||||||
|
|
@ -152,6 +152,12 @@ export function useFormValues({
|
||||||
formModel[item.field] = defaultValue;
|
formModel[item.field] = defaultValue;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
if (!isNil(componentProps?.defaultValue)) {
|
||||||
|
obj[item.field] = componentProps?.defaultValue;
|
||||||
|
if (formModel[item.field] === undefined) {
|
||||||
|
formModel[item.field] = componentProps?.defaultValue;
|
||||||
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
defaultValueRef.value = cloneDeep(obj);
|
defaultValueRef.value = cloneDeep(obj);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -41,6 +41,7 @@ export interface FormActionType {
|
||||||
validateFields: (nameList?: NamePath[]) => Promise<any>;
|
validateFields: (nameList?: NamePath[]) => Promise<any>;
|
||||||
validate: <T = Recordable>(nameList?: NamePath[] | false) => Promise<T>;
|
validate: <T = Recordable>(nameList?: NamePath[] | false) => Promise<T>;
|
||||||
scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>;
|
scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>;
|
||||||
|
resetDefaultField:(name?: NamePath[]) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type RegisterFn = (formInstance: FormActionType) => void;
|
export type RegisterFn = (formInstance: FormActionType) => void;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue