refactor(PageModal): ♻️ 重构watch、computed、watchEffect调用

src/components/PageModal/Form.vue

@@ -106,46 +106,45 @@ const formRef = ref<FormInstance>();
 const formItems = reactive(props.formItems);
 const formData = reactive<IObject>({});
 const formRules: FormRules = {};
-const watchArr = [];
+const prepareFuncs = [];
-const computedArr = [];
-const watchEffectArr = [];
 // 初始化
 for (const item of formItems) {
   item.initFn && item.initFn(item);
   formData[item.prop] = item.initialValue ?? "";
   formRules[item.prop] = item.rules ?? [];
+
   if (item.watch !== undefined) {
-    watchArr.push({ field: item.prop, func: item.watch });
+    prepareFuncs.push(() => {
-  }
-  if (item.computed !== undefined) {
-    computedArr.push({ field: item.prop, func: item.computed });
-  }
-  if (item.watchEffect !== undefined) {
-    watchEffectArr.push(item.watchEffect);
-  }
-}
-watchArr.forEach(({ field, func }) => {
       watch(
-    () => formData[field],
+        () => formData[item.prop],
         (newValue, oldValue) => {
-      func(newValue, oldValue, formData);
+          item.watch && item.watch(newValue, oldValue, formData);
         }
       );
     });
-computedArr.forEach(({ field, func }) => {
+  }
-  formData[field] = computed({
+
+  if (item.computed !== undefined) {
+    prepareFuncs.push(() => {
+      formData[item.prop] = computed({
         get() {
-      return func(formData);
+          return item.computed ? item.computed(formData) : undefined;
         },
         // TODO
         set() {},
       });
     });
-watchEffectArr.forEach((func) => {
+  }
+
+  if (item.watchEffect !== undefined) {
+    prepareFuncs.push(() => {
       watchEffect(() => {
-    func(formData);
+        item.watchEffect && item.watchEffect(formData);
       });
     });
+  }
+}
+prepareFuncs.forEach((func) => func());
 // 获取表单数据
 function getFormData(key?: string) {
   return key === undefined ? formData : formData[key] ?? undefined;