refactor(iframe): 优化 iframe 在tab页关闭和刷新时重新加载iframe页面。

mineadmin · Nov 27, 2024 · 936abb0 · 936abb0
1 parent f368ec1
commit 936abb0
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 0 deletions.
diff --git a/web/src/layouts/components/iframe/index.tsx b/web/src/layouts/components/iframe/index.tsx
@@ -15,6 +15,7 @@ export default defineComponent({
     const route = useRoute()
     const routers = useRouter().getRoutes()
     const iframeStore = useIframeKeepAliveStore()
+    const list = computed(() => iframeStore.iframeList ?? [])
     onMounted(() => {
       const iframeArea = document.querySelector('.mine-iframe-area') as HTMLDivElement
       iframeArea.classList.add('overflow-hidden')

diff --git a/web/src/store/modules/useTabStore.ts b/web/src/store/modules/useTabStore.ts
@@ -20,6 +20,7 @@ const useTabStore = defineStore(
     const router = useRouter()
     const settingStore = useSettingStore()
     const keepAliveStore = useKeepAliveStore()
+    const iframeKeepLiveStore = useIframeKeepAliveStore()
     const welcomePage = settingStore.getSettings('welcomePage') as SystemSettings.welcomePage
     const tabList = ref<MineTabbar[]>([])
     const { isLoading } = useNProgress()
@@ -103,8 +104,12 @@ const useTabStore = defineStore(
       keepAliveStore.hidden()
       await new Promise(resolve => resolve(setTimeout(() => {
       }, 200)))
+      if (tab.path.indexOf('MineIframe') > 0) {
+        iframeKeepLiveStore.remove(tab.name)
+      }
       keepAliveStore.remove(tab.name)
       await nextTick(async () => {
+        iframeKeepLiveStore.add(tab.name)
         keepAliveStore.add(tab.name)
         keepAliveStore.display()
         await go(tab)
@@ -126,6 +131,9 @@ const useTabStore = defineStore(
               await router.push(tabList.value[idx - 1].fullPath)
             }
           }
+          if (tab.path.indexOf('MineIframe') > 0) {
+            iframeKeepLiveStore.remove(tab.name)
+          }
           tabList.value.splice(idx, 1)
           keepAliveStore.remove(item.name)
         }
@@ -138,6 +146,9 @@ const useTabStore = defineStore(
           return true
         }
         else {
+          if (item.path.indexOf('MineIframe') > 0) {
+            iframeKeepLiveStore.remove(item.name)
+          }
           keepAliveStore.remove(item.name)
           return false
         }
@@ -158,6 +169,9 @@ const useTabStore = defineStore(
             return true
           }
           else {
+            if (item.path.indexOf('MineIframe') > 0) {
+              iframeKeepLiveStore.remove(item.name)
+            }
             keepAliveStore.remove(item.name)
             return false
           }
@@ -179,6 +193,9 @@ const useTabStore = defineStore(
             return true
           }
           else {
+            if (item.path.indexOf('MineIframe') > 0) {
+              iframeKeepLiveStore.remove(item.name)
+            }
             keepAliveStore.remove(item.name)
             return false
           }
@@ -206,6 +223,7 @@ const useTabStore = defineStore(
     function clearTab() {
       tabList.value = [defaultTab.value]
       keepAliveStore.clean()
+      iframeKeepLiveStore.clean()
     }
 
     function storage() {