perf(form): perf form in modal

vben
1 parent 733afddd
Showing 4 changed files with 27 additions and 17 deletions
package.json
src/components/Form/src/BasicForm.vue
src/components/Form/src/hooks/useFormValues.ts
yarn.lock
@@ -97,7 +97,7 @@
     "vite-plugin-html": "^2.0.0-beta.6",
     "vite-plugin-mock": "^2.0.0-rc.2",
     "vite-plugin-purge-icons": "^0.6.0",
-    "vite-plugin-pwa": "^0.4.0",
+    "vite-plugin-pwa": "^0.4.1",
     "vite-plugin-style-import": "^0.4.6",
     "vue-eslint-parser": "^7.4.1",
     "yargs": "^16.2.0"
@@ -33,9 +33,19 @@
 <script lang="ts">
   import type { FormActionType, FormProps, FormSchema } from './types/form';
   import type { AdvanceState } from './types/hooks';
-  import type { CSSProperties, Ref, WatchStopHandle } from 'vue';
-
-  import { defineComponent, reactive, ref, computed, unref, onMounted, watch, toRefs } from 'vue';
+  import type { CSSProperties, Ref } from 'vue';
+
+  import {
+    defineComponent,
+    reactive,
+    ref,
+    computed,
+    unref,
+    onMounted,
+    watch,
+    toRefs,
+    nextTick,
+  } from 'vue';
   import { Form, Row } from 'ant-design-vue';
   import FormItem from './components/FormItem';
   import FormAction from './components/FormAction.vue';
@@ -51,6 +61,7 @@
   import { useFormEvents } from './hooks/useFormEvents';
   import { createFormContext } from './hooks/useFormContext';
   import { useAutoFocus } from './hooks/useAutoFocus';
+  import { useModalContext } from '/@/components/Modal';
   import { basicProps } from './props';
   import { useDesign } from '/@/hooks/web/useDesign';
@@ -62,6 +73,7 @@
     emits: ['advanced-change', 'reset', 'submit', 'register'],
     setup(props, { emit }) {
       const formModel = reactive<Recordable>({});
+      const modalFn = useModalContext();
       const advanceState = reactive<AdvanceState>({
         isAdvanced: true,
@@ -188,11 +200,15 @@
         }
       );
-      const stopWatch: WatchStopHandle = watch(
+      watch(
         () => getSchema.value,
         (schema) => {
+          nextTick(() => {
+            //  Solve the problem of modal adaptive height calculation when the form is placed in the modal
+            modalFn?.redoModalHeight?.();
+          });
           if (unref(isInitedDefaultRef)) {
-            return stopWatch();
+            return;
           }
           if (schema?.length) {
             initDefault();
 import { isArray, isFunction, isObject, isString, isNullOrUnDef } from '/@/utils/is';
 import { dateUtil } from '/@/utils/dateUtil';
-import { unref, nextTick } from 'vue';
+import { unref } from 'vue';
 import type { Ref, ComputedRef } from 'vue';
 import type { FieldMapToTime, FormSchema } from '../types/form';
-import { useModalContext } from '/@/components/Modal';
 interface UseFormValuesContext {
   transformDateFuncRef: Ref<Fn>;
@@ -20,7 +19,6 @@ export function useFormValues({
   getSchema,
   formModel,
 }: UseFormValuesContext) {
-  const modalFn = useModalContext();
   // Processing form values
   function handleFormValues(values: Recordable) {
     if (!isObject(values)) {
@@ -85,10 +83,6 @@ export function useFormValues({
       }
     });
     defaultValueRef.value = obj;
-    nextTick(() => {
-      //  Solve the problem of modal adaptive height calculation when the form is placed in the modal
-      modalFn?.redoModalHeight?.();
-    });
   }
   return { handleFormValues, initDefault };
@@ -7722,10 +7722,10 @@ vite-plugin-purge-icons@^0.6.0:
     "@purge-icons/generated" "^0.6.0"
     rollup-plugin-purge-icons "^0.6.0"
-vite-plugin-pwa@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.4.0.tgz#be7723315beed00ca7f9d23b24c5b1356276747c"
-  integrity sha512-+qsqpR6QgkxY8IdSyjHDGz5L5+3pbXKVP2KztqMeamu8Rpki45kEUMrdhloFSPiSNA7L+xS/U6WDyNe+u0IP4A==
+vite-plugin-pwa@^0.4.1:
+  version "0.4.1"
+  resolved "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.4.1.tgz#eae03c4dd10cd51600c08fd1aaa179a92577c456"
+  integrity sha512-UvcdW93FT0+2dRSLasQtvJepBwXj+UTcvzBekca6YuVdn/MTdEX01J/QqPL+v3KUZBnNM2MAOFpLIkZ3wi9t8g==
   dependencies:
     debug "^4.3.2"
     fast-glob "^3.2.5"