fix(form): 修复 disabled 关联子组件收集问题 (jd-opensource#2958)

yang1206 · Mar 11, 2024 · 27bc52d · 27bc52d
1 parent eb9a27f
commit 27bc52d
Show file tree

Hide file tree

Showing 6 changed files with 15 additions and 8 deletions.
diff --git a/src/packages/__VUE/form/common.ts b/src/packages/__VUE/form/common.ts
@@ -1,9 +1,11 @@
 import { computed } from 'vue';
 import { useParent } from '@/packages/utils';
-import { FORM_KEY } from './types';
 import type { ComputedRef, Ref } from 'vue';
 
+export const FORM_KEY = Symbol('nut-form');
+export const FORM_DISABLED_KEY = Symbol('nut-form-disabled');
+
 export const useFormDisabled = (disabled: Ref<boolean>): ComputedRef<boolean> => {
-  const { parent } = useParent(FORM_KEY);
+  const { parent } = useParent(FORM_DISABLED_KEY);
   return computed(() => disabled.value || parent?.props?.disabled || false);
 };
diff --git a/src/packages/__VUE/form/form.taro.vue b/src/packages/__VUE/form/form.taro.vue
@@ -10,7 +10,7 @@ import { reactive, computed, provide, watch } from 'vue';
 import { useChildren, getPropByPath, isPromise } from '@/packages/utils';
 import NutCellGroup from '../cellgroup/index.taro.vue';
 import type { FormErrorMessage, FormLabelPosition, FormRule, FormRules, FormStarPosition, FormItemRule } from './types';
-import { FORM_KEY } from './types';
+import { FORM_KEY, FORM_DISABLED_KEY } from './common';
 
 defineOptions({
   name: 'NutForm'
@@ -37,6 +37,9 @@ const emit = defineEmits(['validate']);
 const { children, linkChildren } = useChildren(FORM_KEY);
 linkChildren({ props });
 
+const { linkChildren: linkChildren2 } = useChildren(FORM_DISABLED_KEY);
+linkChildren2({ props });
+
 const formErrorTip = computed(() => reactive<any>({}));
 
 provide('formErrorTip', formErrorTip);

diff --git a/src/packages/__VUE/form/form.vue b/src/packages/__VUE/form/form.vue
@@ -10,7 +10,7 @@ import { reactive, computed, provide, watch } from 'vue';
 import { useChildren, getPropByPath, isPromise } from '@/packages/utils';
 import NutCellGroup from '../cellgroup/index.vue';
 import type { FormErrorMessage, FormLabelPosition, FormRule, FormRules, FormStarPosition, FormItemRule } from './types';
-import { FORM_KEY } from './types';
+import { FORM_KEY, FORM_DISABLED_KEY } from './common';
 
 defineOptions({
   name: 'NutForm'
@@ -37,6 +37,9 @@ const emit = defineEmits(['validate']);
 const { children, linkChildren } = useChildren(FORM_KEY);
 linkChildren({ props });
 
+const { linkChildren: linkChildren2 } = useChildren(FORM_DISABLED_KEY);
+linkChildren2({ props });
+
 const formErrorTip = computed(() => reactive<any>({}));
 
 provide('formErrorTip', formErrorTip);
@@ -144,6 +147,7 @@ const validate = (customProp = '') => {
   return new Promise((resolve, reject) => {
     try {
       const task = getTaskFromChildren();
+      console.log('task', task);
 
       const errors = task.map((item) => {
         if (customProp && customProp !== item.prop) {

diff --git a/src/packages/__VUE/form/types.ts b/src/packages/__VUE/form/types.ts
@@ -1,5 +1,3 @@
-export const FORM_KEY = Symbol('nut-form');
-
 export interface FormItemRuleWithoutValidator {
   [key: string]: any;
   regex?: RegExp;

diff --git a/src/packages/__VUE/formitem/form-item.taro.vue b/src/packages/__VUE/formitem/form-item.taro.vue
@@ -27,7 +27,7 @@ import { pxCheck } from '@/packages/utils/pxCheck';
 import { computed, inject, CSSProperties } from 'vue';
 import type { FormItemRule, FormLabelPosition, FormStarPosition } from '../form/types';
 import NutCell from '../cell/index.taro.vue';
-import { FORM_KEY } from '../form/types';
+import { FORM_KEY } from '../form/common';
 import { useParent } from '@/packages/utils';
 
 defineOptions({

diff --git a/src/packages/__VUE/formitem/form-item.vue b/src/packages/__VUE/formitem/form-item.vue
@@ -27,7 +27,7 @@ import { pxCheck } from '@/packages/utils/pxCheck';
 import { computed, inject, CSSProperties } from 'vue';
 import type { FormItemRule, FormLabelPosition, FormStarPosition } from '../form/types';
 import NutCell from '../cell/index.vue';
-import { FORM_KEY } from '../form/types';
+import { FORM_KEY } from '../form/common';
 import { useParent } from '@/packages/utils';
 
 defineOptions({