From e379d6ce67cb483c1a917c8077bcea47b37629ad Mon Sep 17 00:00:00 2001
From: Soybean <soybeanjs@outlook.com>
Date: Fri, 24 May 2024 02:23:59 +0800
Subject: [PATCH] fix(projects): fix multi tab page only render once. fixed
 #441

---
 src/layouts/modules/global-content/index.vue | 4 +++-
 src/store/modules/tab/index.ts               | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/layouts/modules/global-content/index.vue b/src/layouts/modules/global-content/index.vue
index 8c7b7f45..ff8ded61 100644
--- a/src/layouts/modules/global-content/index.vue
+++ b/src/layouts/modules/global-content/index.vue
@@ -3,6 +3,7 @@ import { computed } from 'vue';
 import { useAppStore } from '@/store/modules/app';
 import { useThemeStore } from '@/store/modules/theme';
 import { useRouteStore } from '@/store/modules/route';
+import { useTabStore } from '@/store/modules/tab';
 
 defineOptions({
   name: 'GlobalContent'
@@ -20,6 +21,7 @@ withDefaults(defineProps<Props>(), {
 const appStore = useAppStore();
 const themeStore = useThemeStore();
 const routeStore = useRouteStore();
+const tabStore = useTabStore();
 
 const transitionName = computed(() => (themeStore.page.animate ? themeStore.page.animateMode : ''));
 </script>
@@ -36,7 +38,7 @@ const transitionName = computed(() => (themeStore.page.animate ? themeStore.page
         <component
           :is="Component"
           v-if="appStore.reloadFlag"
-          :key="route.path"
+          :key="tabStore.getTabIdByRoute(route)"
           :class="{ 'p-16px': showPadding }"
           class="flex-grow bg-layout transition-300"
         />
diff --git a/src/store/modules/tab/index.ts b/src/store/modules/tab/index.ts
index 66f5480b..d1b68c55 100644
--- a/src/store/modules/tab/index.ts
+++ b/src/store/modules/tab/index.ts
@@ -17,6 +17,7 @@ import {
   getDefaultHomeTab,
   getFixedTabIds,
   getTabByRoute,
+  getTabIdByRoute,
   isTabInTabs,
   updateTabByI18nKey,
   updateTabsByI18nKey
@@ -288,6 +289,7 @@ export const useTabStore = defineStore(SetupStoreId.Tab, () => {
     setTabLabel,
     resetTabLabel,
     isTabRetain,
-    updateTabsByLocale
+    updateTabsByLocale,
+    getTabIdByRoute
   };
 });