perf: perf the control logic of Tab

Author: ming4762

packages/stores/src/modules/tabbar.test.ts

@@ -21,6 +21,7 @@ describe('useAccessStore', () => {
     const store = useTabbarStore();
     const tab: any = {
       fullPath: '/home',
+      key: 'home',
       meta: {},
       name: 'Home',
       path: '/home',
@@ -35,6 +36,7 @@ describe('useAccessStore', () => {
     const newTab: any = {
       fullPath: '/new',
       meta: {},
+      key: '/new',
       name: 'New',
       path: '/new',
     };
@@ -46,12 +48,14 @@ describe('useAccessStore', () => {
     const store = useTabbarStore();
     const initialTab: any = {
       fullPath: '/existing',
-      meta: {},
+      meta: {
+        fullPathKey: false,
+      },
       name: 'Existing',
       path: '/existing',
       query: {},
     };
-    store.tabs.push(initialTab);
+    store.addTab(initialTab);
     const updatedTab = { ...initialTab, query: { id: '1' } };
     store.addTab(updatedTab);
     expect(store.tabs.length).toBe(1);
@@ -157,7 +161,7 @@ describe('useAccessStore', () => {
       path: '/contact',
     } as any);
 
-    await store._bulkCloseByPaths(['/home', '/contact']);
+    await store._bulkCloseByKeys(['/home', '/contact']);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('About');
@@ -183,9 +187,8 @@ describe('useAccessStore', () => {
       name: 'Contact',
       path: '/contact',
     };
-    store.addTab(targetTab);
-
-    await store.closeLeftTabs(targetTab);
+    const addTargetTab = store.addTab(targetTab);
+    await store.closeLeftTabs(addTargetTab);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('Contact');
@@ -205,15 +208,15 @@ describe('useAccessStore', () => {
       name: 'About',
       path: '/about',
     };
-    store.addTab(targetTab);
+    const addTargetTab = store.addTab(targetTab);
     store.addTab({
       fullPath: '/contact',
       meta: {},
       name: 'Contact',
       path: '/contact',
     } as any);
 
-    await store.closeOtherTabs(targetTab);
+    await store.closeOtherTabs(addTargetTab);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('About');
@@ -227,7 +230,7 @@ describe('useAccessStore', () => {
       name: 'Home',
       path: '/home',
     };
-    store.addTab(targetTab);
+    const addTargetTab = store.addTab(targetTab);
     store.addTab({
       fullPath: '/about',
       meta: {},
@@ -241,7 +244,7 @@ describe('useAccessStore', () => {
       path: '/contact',
     } as any);
 
-    await store.closeRightTabs(targetTab);
+    await store.closeRightTabs(addTargetTab);
 
     expect(store.tabs).toHaveLength(1);
     expect(store.tabs[0]?.name).toBe('Home');

packages/stores/src/modules/tabbar.ts

@@ -104,14 +104,14 @@ export const useTabbarStore = defineStore('core-tabbar', {
      * @zh_CN 添加标签页
      * @param routeTab
      */
-    addTab(routeTab: TabDefinition) {
+    addTab(routeTab: TabDefinition): TabDefinition {
       const tab = cloneTab(routeTab);
       // 如果未设置key，设置tab的key
       if (!tab.key) {
         tab.key = getTabKey(routeTab);
       }
       if (!isTabShown(tab)) {
-        return;
+        return tab;
       }
 
       const tabIndex = this.tabs.findIndex((item) => {
@@ -165,6 +165,7 @@ export const useTabbarStore = defineStore('core-tabbar', {
         this.tabs.splice(tabIndex, 1, mergedTab);
       }
       this.updateCacheTabs();
+      return tab;
     },
     /**
      * @zh_CN 关闭所有标签页
@@ -593,7 +594,9 @@ function getTabKey(tab: RouteLocationNormalized | RouteRecordNormalized) {
   if (pageKey) {
     return pageKey as string;
   }
-  return decodeURIComponent(((fullPathKey ?? true) ? fullPath : path) || path);
+  const rawKey =
+    fullPathKey === true || fullPathKey === undefined ? fullPath : path;
+  return decodeURIComponent(rawKey || path);
 }
 
 function routeToTab(route: RouteRecordNormalized) {