chore: form reset logic modification

vben
1 parent e034d1ba
Showing 5 changed files with 40 additions and 25 deletions
CHANGELOG.zh_CN.md
src/components/Form/src/BasicForm.vue
src/components/Form/src/FormItem.tsx
src/layouts/default/multitabs/index.tsx
src/views/demo/table/tableData.tsx
@@ -8,6 +8,7 @@
 ### 🎫 Chores
 - 删除代码内的可选链语法
+- 表单重置逻辑修改
 ### 🐛 Bug Fixes
@@ -194,7 +194,7 @@
               model: formModel,
               field: schema.field,
               values: {
-                ...unerf(defaultValueRef),
+                ...unref(defaultValueRef),
                 ...formModel,
               },
             });
@@ -271,11 +271,11 @@
         const formEl = unref(formElRef);
         if (!formEl) return;
         Object.keys(formModel).forEach((key) => {
-          (formModel as any)[key] = undefined;
+          (formModel as any)[key] = defaultValueRef.value[key];
         });
-        const values = formEl.resetFields();
+        // const values = formEl.resetFields();
         emit('reset', toRaw(formModel));
-        return values;
+        // return values;
       }
       /**
@@ -139,6 +139,7 @@ export default defineComponent({
       }
       return rules;
     }
+
     function renderComponent() {
       const {
         componentProps,
@@ -163,7 +164,6 @@ export default defineComponent({
           }
         },
       };
-
       const Comp = componentMap.get(component);
       const { autoSetPlaceHolder, size } = props.formProps;
@@ -189,9 +189,22 @@ export default defineComponent({
       const bindValue = {
         [isCheck ? 'checked' : 'value']: (props.formModel as any)[field],
       };
+      // TODO先兼容antd的警告，后面官方修复后删除
+      if (component === 'Select') {
+        if (Reflect.has(propsData, 'options')) {
+          propsData.options = propsData.options.map((item: any) => {
+            return {
+              key: item.value,
+              ...item,
+            };
+          });
+        }
+      }
+
       if (!renderComponentContent) {
         return <Comp {...propsData} {...on} {...bindValue} />;
       }
+
       return (
         <Comp {...propsData} {...on} {...bindValue}>
           {{
@@ -8,7 +8,7 @@ import {
   computed,
   // ref,
   unref,
-  onMounted,
+  // onMounted,
   toRaw,
 } from 'vue';
 import { Tabs } from 'ant-design-vue';
@@ -24,7 +24,7 @@ import { tabStore } from &#39;/@/store/modules/tab&#39;;
 import { closeTab } from './useTabDropdown';
 import router from '/@/router';
 import { useTabs } from '/@/hooks/web/useTabs';
-import { PageEnum } from '/@/enums/pageEnum';
+// import { PageEnum } from '/@/enums/pageEnum';
 import './index.less';
 export default defineComponent({
@@ -33,14 +33,17 @@ export default defineComponent({
     let isAddAffix = false;
     const go = useGo();
     const { currentRoute } = useRouter();
-    const { addTab, activeKeyRef } = useTabs();
-    onMounted(() => {
-      const route = unref(currentRoute);
-      addTab(unref(currentRoute).path as PageEnum, false, {
-        query: route.query,
-        params: route.params,
-      });
-    });
+    const {
+      // addTab,
+      activeKeyRef,
+    } = useTabs();
+    // onMounted(() => {
+    // const route = unref(currentRoute);
+    // addTab(unref(currentRoute).path as PageEnum, false, {
+    //   query: route.query,
+    //   params: route.params,
+    // });
+    // });
     // 当前激活tab
     // const activeKeyRef = ref<string>('');
@@ -64,14 +67,14 @@ export default defineComponent({
         // 监听路由的话虽然可以，但是路由切换的时间会造成卡顿现象？
         // 使用useTab的addTab的话，当用户手动调转，需要自行调用addTab
         // tabStore.commitAddTab((unref(currentRoute) as unknown) as AppRouteRecordRaw);
-        // const { affix } = currentRoute.value.meta || {};
-        // if (affix) return;
-        // const hasInTab = tabStore.getTabsState.some(
-        //   (item) => item.fullPath === currentRoute.value.fullPath
-        // );
-        // if (!hasInTab) {
-        //   tabStore.commitAddTab((unref(currentRoute) as unknown) as AppRouteRecordRaw);
-        // }
+        const { affix } = currentRoute.value.meta || {};
+        if (affix) return;
+        const hasInTab = tabStore.getTabsState.some(
+          (item) => item.fullPath === currentRoute.value.fullPath
+        );
+        if (!hasInTab) {
+          tabStore.commitAddTab((unref(currentRoute) as unknown) as AppRouteRecordRaw);
+        }
       },
       {
         immediate: true,
@@ -239,12 +239,10 @@ export function getFormConfig(): Partial&lt;FormProps&gt; {
             {
               label: '选项1',
               value: '1',
-              key: '1',
             },
             {
               label: '选项2',
               value: '2',
-              key: '2',
             },
           ],
         },