Commit 2882d6e937a7d4996ae42ff62148d9a2f893fe47

Authored by vben
1 parent 733afddd

perf(form): perf form in modal

package.json
... ... @@ -97,7 +97,7 @@
97 97 "vite-plugin-html": "^2.0.0-beta.6",
98 98 "vite-plugin-mock": "^2.0.0-rc.2",
99 99 "vite-plugin-purge-icons": "^0.6.0",
100   - "vite-plugin-pwa": "^0.4.0",
  100 + "vite-plugin-pwa": "^0.4.1",
101 101 "vite-plugin-style-import": "^0.4.6",
102 102 "vue-eslint-parser": "^7.4.1",
103 103 "yargs": "^16.2.0"
... ...
src/components/Form/src/BasicForm.vue
... ... @@ -33,9 +33,19 @@
33 33 <script lang="ts">
34 34 import type { FormActionType, FormProps, FormSchema } from './types/form';
35 35 import type { AdvanceState } from './types/hooks';
36   - import type { CSSProperties, Ref, WatchStopHandle } from 'vue';
37   -
38   - import { defineComponent, reactive, ref, computed, unref, onMounted, watch, toRefs } from 'vue';
  36 + import type { CSSProperties, Ref } from 'vue';
  37 +
  38 + import {
  39 + defineComponent,
  40 + reactive,
  41 + ref,
  42 + computed,
  43 + unref,
  44 + onMounted,
  45 + watch,
  46 + toRefs,
  47 + nextTick,
  48 + } from 'vue';
39 49 import { Form, Row } from 'ant-design-vue';
40 50 import FormItem from './components/FormItem';
41 51 import FormAction from './components/FormAction.vue';
... ... @@ -51,6 +61,7 @@
51 61 import { useFormEvents } from './hooks/useFormEvents';
52 62 import { createFormContext } from './hooks/useFormContext';
53 63 import { useAutoFocus } from './hooks/useAutoFocus';
  64 + import { useModalContext } from '/@/components/Modal';
54 65  
55 66 import { basicProps } from './props';
56 67 import { useDesign } from '/@/hooks/web/useDesign';
... ... @@ -62,6 +73,7 @@
62 73 emits: ['advanced-change', 'reset', 'submit', 'register'],
63 74 setup(props, { emit }) {
64 75 const formModel = reactive<Recordable>({});
  76 + const modalFn = useModalContext();
65 77  
66 78 const advanceState = reactive<AdvanceState>({
67 79 isAdvanced: true,
... ... @@ -188,11 +200,15 @@
188 200 }
189 201 );
190 202  
191   - const stopWatch: WatchStopHandle = watch(
  203 + watch(
192 204 () => getSchema.value,
193 205 (schema) => {
  206 + nextTick(() => {
  207 + // Solve the problem of modal adaptive height calculation when the form is placed in the modal
  208 + modalFn?.redoModalHeight?.();
  209 + });
194 210 if (unref(isInitedDefaultRef)) {
195   - return stopWatch();
  211 + return;
196 212 }
197 213 if (schema?.length) {
198 214 initDefault();
... ...
src/components/Form/src/hooks/useFormValues.ts
1 1 import { isArray, isFunction, isObject, isString, isNullOrUnDef } from '/@/utils/is';
2 2 import { dateUtil } from '/@/utils/dateUtil';
3 3  
4   -import { unref, nextTick } from 'vue';
  4 +import { unref } from 'vue';
5 5 import type { Ref, ComputedRef } from 'vue';
6 6 import type { FieldMapToTime, FormSchema } from '../types/form';
7   -import { useModalContext } from '/@/components/Modal';
8 7  
9 8 interface UseFormValuesContext {
10 9 transformDateFuncRef: Ref<Fn>;
... ... @@ -20,7 +19,6 @@ export function useFormValues({
20 19 getSchema,
21 20 formModel,
22 21 }: UseFormValuesContext) {
23   - const modalFn = useModalContext();
24 22 // Processing form values
25 23 function handleFormValues(values: Recordable) {
26 24 if (!isObject(values)) {
... ... @@ -85,10 +83,6 @@ export function useFormValues({
85 83 }
86 84 });
87 85 defaultValueRef.value = obj;
88   - nextTick(() => {
89   - // Solve the problem of modal adaptive height calculation when the form is placed in the modal
90   - modalFn?.redoModalHeight?.();
91   - });
92 86 }
93 87  
94 88 return { handleFormValues, initDefault };
... ...
yarn.lock
... ... @@ -7722,10 +7722,10 @@ vite-plugin-purge-icons@^0.6.0:
7722 7722 "@purge-icons/generated" "^0.6.0"
7723 7723 rollup-plugin-purge-icons "^0.6.0"
7724 7724  
7725   -vite-plugin-pwa@^0.4.0:
7726   - version "0.4.0"
7727   - resolved "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.4.0.tgz#be7723315beed00ca7f9d23b24c5b1356276747c"
7728   - integrity sha512-+qsqpR6QgkxY8IdSyjHDGz5L5+3pbXKVP2KztqMeamu8Rpki45kEUMrdhloFSPiSNA7L+xS/U6WDyNe+u0IP4A==
  7725 +vite-plugin-pwa@^0.4.1:
  7726 + version "0.4.1"
  7727 + resolved "https://registry.npmjs.org/vite-plugin-pwa/-/vite-plugin-pwa-0.4.1.tgz#eae03c4dd10cd51600c08fd1aaa179a92577c456"
  7728 + integrity sha512-UvcdW93FT0+2dRSLasQtvJepBwXj+UTcvzBekca6YuVdn/MTdEX01J/QqPL+v3KUZBnNM2MAOFpLIkZ3wi9t8g==
7729 7729 dependencies:
7730 7730 debug "^4.3.2"
7731 7731 fast-glob "^3.2.5"
... ...