From 303b0663495acbd5e83745b23bc1f973b9513b85 Mon Sep 17 00:00:00 2001 From: vben Date: Sat, 5 Oct 2024 16:47:31 +0800 Subject: [PATCH 1/2] fix: naive ui form reset does not meet expectations --- apps/web-naive/src/adapter/form.ts | 3 +++ packages/@core/ui-kit/form-ui/src/config.ts | 9 +++++++-- .../@core/ui-kit/form-ui/src/form-render/form-field.vue | 7 ++++--- packages/@core/ui-kit/form-ui/src/form-render/form.vue | 2 ++ packages/@core/ui-kit/form-ui/src/types.ts | 5 +++++ .../effects/common-ui/src/ui/authentication/types.ts | 5 +---- packages/effects/plugins/src/vxe-table/use-vxe-grid.vue | 4 ++-- packages/stores/src/modules/user.ts | 1 + packages/utils/src/index.ts | 1 + 9 files changed, 26 insertions(+), 11 deletions(-) diff --git a/apps/web-naive/src/adapter/form.ts b/apps/web-naive/src/adapter/form.ts index 1c051b4a8e2..eb76547683c 100644 --- a/apps/web-naive/src/adapter/form.ts +++ b/apps/web-naive/src/adapter/form.ts @@ -84,7 +84,10 @@ setupVbenForm({ Upload: NUpload, }, config: { + // naive-ui组件不接受onChang事件,所以需要禁用 disabledOnChangeListener: true, + // naive-ui组件的空值为null,不能是undefined,否则重置表单时不生效 + emptyStateValue: null, baseModelPropName: 'value', modelPropNameMap: { Checkbox: 'checked', diff --git a/packages/@core/ui-kit/form-ui/src/config.ts b/packages/@core/ui-kit/form-ui/src/config.ts index 7c118634673..33b11317c30 100644 --- a/packages/@core/ui-kit/form-ui/src/config.ts +++ b/packages/@core/ui-kit/form-ui/src/config.ts @@ -43,8 +43,13 @@ export function setupVbenForm< >(options: VbenFormAdapterOptions) { const { components, config, defineRules } = options; - DEFAULT_FORM_COMMON_CONFIG.disabledOnChangeListener = - config?.disabledOnChangeListener ?? false; + const { disabledOnChangeListener = false, emptyStateValue = undefined } = + (config || {}) as FormCommonConfig; + + Object.assign(DEFAULT_FORM_COMMON_CONFIG, { + disabledOnChangeListener, + emptyStateValue, + }); if (defineRules) { for (const key of Object.keys(defineRules)) { diff --git a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue index c116d49c482..f66a4bb6b87 100644 --- a/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue +++ b/packages/@core/ui-kit/form-ui/src/form-render/form-field.vue @@ -33,6 +33,7 @@ const { description, disabled, disabledOnChangeListener, + emptyStateValue, fieldName, formFieldProps, label, @@ -55,7 +56,7 @@ const formApi = formRenderProps.form; const isInValid = computed(() => errors.value?.length > 0); -const fieldComponent = computed(() => { +const FieldComponent = computed(() => { const finalComponent = isString(component) ? componentMap.value[component] : component; @@ -213,7 +214,7 @@ function fieldBindEvent(slotProps: Record) { if (bindEventField) { return { [`onUpdate:${bindEventField}`]: handler, - [bindEventField]: value, + [bindEventField]: value === undefined ? emptyStateValue : value, onChange: disabledOnChangeListener ? undefined : (e: Record) => { @@ -300,7 +301,7 @@ function autofocus() { }" >