fix(form): improve warning prompt, fix #538

Vben
1 parent 6afee415
Showing 5 changed files with 24 additions and 41 deletions
package.json
src/components/Form/src/BasicForm.vue
src/components/Form/src/hooks/useAutoFocus.ts
src/components/Form/src/hooks/useFormValues.ts
yarn.lock
@@ -63,7 +63,7 @@
   "devDependencies": {
     "@commitlint/cli": "^12.1.1",
     "@commitlint/config-conventional": "^12.1.1",
-    "@iconify/json": "^1.1.331",
+    "@iconify/json": "^1.1.333",
     "@purge-icons/generated": "^0.7.0",
     "@types/codemirror": "^0.0.109",
     "@types/crypto-js": "^4.0.1",
@@ -110,7 +110,7 @@
     "stylelint-order": "^4.1.0",
     "ts-node": "^9.1.1",
     "typescript": "4.2.4",
-    "vite": "2.1.5",
+    "vite": "2.2.3",
     "vite-plugin-compression": "^0.2.4",
     "vite-plugin-html": "^2.0.7",
     "vite-plugin-imagemin": "^0.3.0",
@@ -35,17 +35,7 @@
   import type { AdvanceState } from './types/hooks';
   import type { CSSProperties, Ref } from 'vue';
  
-  import {
-    defineComponent,
-    reactive,
-    ref,
-    computed,
-    unref,
-    onMounted,
-    watch,
-    toRefs,
-    nextTick,
-  } from 'vue';
+  import { defineComponent, reactive, ref, computed, unref, onMounted, watch, nextTick } from 'vue';
   import { Form, Row } from 'ant-design-vue';
   import FormItem from './components/FormItem.vue';
   import FormAction from './components/FormAction.vue';
@@ -143,13 +133,8 @@
         defaultValueRef,
       });
  
-      const { transformDateFunc, fieldMapToTime, autoFocusFirstItem } = toRefs(
-        unref(getProps)
-      ) as any;
-
       const { handleFormValues, initDefault } = useFormValues({
-        transformDateFuncRef: transformDateFunc,
-        fieldMapToTimeRef: fieldMapToTime,
+        getProps,
         defaultValueRef,
         getSchema,
         formModel,
@@ -157,7 +142,7 @@
  
       useAutoFocus({
         getSchema,
-        autoFocusFirstItem,
+        getProps,
         isInitedDefault: isInitedDefaultRef,
         formElRef: formElRef as Ref<FormActionType>,
       });
 import type { ComputedRef, Ref } from 'vue';
-import type { FormSchema, FormActionType } from '../types/form';
+import type { FormSchema, FormActionType, FormProps } from '../types/form';
  
 import { unref, nextTick, watchEffect } from 'vue';
  
 interface UseAutoFocusContext {
   getSchema: ComputedRef<FormSchema[]>;
-  autoFocusFirstItem: Ref<boolean>;
+  getProps: ComputedRef<FormProps>;
   isInitedDefault: Ref<boolean>;
   formElRef: Ref<FormActionType>;
 }
 export async function useAutoFocus({
   getSchema,
-  autoFocusFirstItem,
+  getProps,
   formElRef,
   isInitedDefault,
 }: UseAutoFocusContext) {
   watchEffect(async () => {
-    if (unref(isInitedDefault) || !unref(autoFocusFirstItem)) return;
+    if (unref(isInitedDefault) || !unref(getProps).autoFocusFirstItem) return;
     await nextTick();
     const schemas = unref(getSchema);
     const formEl = unref(formElRef);
@@ -3,21 +3,19 @@ import { dateUtil } from &#39;/@/utils/dateUtil&#39;;
  
 import { unref } from 'vue';
 import type { Ref, ComputedRef } from 'vue';
-import type { FieldMapToTime, FormSchema } from '../types/form';
+import type { FormProps, FormSchema } from '../types/form';
  
 interface UseFormValuesContext {
-  transformDateFuncRef: Ref<Fn>;
-  fieldMapToTimeRef: Ref<FieldMapToTime>;
   defaultValueRef: Ref<any>;
   getSchema: ComputedRef<FormSchema[]>;
+  getProps: ComputedRef<FormProps>;
   formModel: Recordable;
 }
 export function useFormValues({
-  transformDateFuncRef,
-  fieldMapToTimeRef,
   defaultValueRef,
   getSchema,
   formModel,
+  getProps,
 }: UseFormValuesContext) {
   // Processing form values
   function handleFormValues(values: Recordable) {
@@ -31,12 +29,12 @@ export function useFormValues({
       if ((isArray(value) && value.length === 0) || isFunction(value)) {
         continue;
       }
-      const transformDateFunc = unref(transformDateFuncRef);
+      const transformDateFunc = unref(getProps).transformDateFunc;
       if (isObject(value)) {
-        value = transformDateFunc(value);
+        value = transformDateFunc?.(value);
       }
       if (isArray(value) && value[0]?._isAMomentObject && value[1]?._isAMomentObject) {
-        value = value.map((item) => transformDateFunc(item));
+        value = value.map((item) => transformDateFunc?.(item));
       }
       // Remove spaces
       if (isString(value)) {
@@ -51,7 +49,7 @@ export function useFormValues({
    * @description: Processing time interval parameters
    */
   function handleRangeTimeValue(values: Recordable) {
-    const fieldMapToTime = unref(fieldMapToTimeRef);
+    const fieldMapToTime = unref(getProps).fieldMapToTime;
  
     if (!fieldMapToTime || !Array.isArray(fieldMapToTime)) {
       return values;
@@ -1108,10 +1108,10 @@
   dependencies:
     cross-fetch "^3.0.6"
  
-"@iconify/json@^1.1.331":
-  version "1.1.331"
-  resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.331.tgz#5bd10c8764e24a973474992a35b56ea7e32a2115"
-  integrity sha512-6YK6fJccOZYa01o6SV3WHNFWtfdP7+q9urn7s4OIFx0a6FTqole0BHGJ87ZsLp03N96TcGEY2nQGpv3MdezYKg==
+"@iconify/json@^1.1.333":
+  version "1.1.333"
+  resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.333.tgz#d58b3d26c97963a1387b089f0c5accae1719fbea"
+  integrity sha512-JcYRNdt9UUBGsH3U5P/Idw9jzZoDCokVyTUGfweHNRuH4r2xR4oVJgH/CyijdUd0BGZ4ztiO2iVBC1sysk67Yg==
  
 "@intlify/core-base@9.0.0":
   version "9.0.0"
@@ -9336,10 +9336,10 @@ vite-plugin-windicss@0.14.6:
     debug "^4.3.2"
     windicss "^2.5.14"
  
-vite@2.1.5:
-  version "2.1.5"
-  resolved "https://registry.npmjs.org/vite/-/vite-2.1.5.tgz#4857da441c62f7982c83cbd5f42a00330f20c9c1"
-  integrity sha512-tYU5iaYeUgQYvK/CNNz3tiJ8vYqPWfCE9IQ7K0iuzYovWw7lzty7KRYGWwV3CQPh0NKxWjOczAqiJsCL0Xb+Og==
+vite@2.2.3:
+  version "2.2.3"
+  resolved "https://registry.npmjs.org/vite/-/vite-2.2.3.tgz#1acbdfa56ac00e00e7ccb6988f63f130c2f99dbb"
+  integrity sha512-PtjyBL4GtACM+uT5q5hi2+AlMBbb6YI2b2bam6QI8ZdZt4FezseF0yZHQx0G+b3po9jIJ/GS5N9gc5Yq9Rue7g==
   dependencies:
     esbuild "^0.9.3"
     postcss "^8.2.1"