fix: fix keepAlive not work

vben
1 parent 4cca0071
Showing 6 changed files with 14 additions and 15 deletions
src/layouts/page/index.tsx
src/layouts/page/useCache.ts
src/router/guard/index.ts
src/router/index.ts
src/router/routes/modules/demo/level.ts
src/store/modules/tab.ts
@@ -45,7 +45,7 @@ export default defineComponent({
                 const renderComp = () => <Component key={route.fullPath} />;
  
                 const PageContent = unref(openCache) ? (
-                  <KeepAlive>{renderComp()}</KeepAlive>
+                  <KeepAlive include={cacheTabs}>{renderComp()}</KeepAlive>
                 ) : (
                   renderComp()
                 );
@@ -35,17 +35,18 @@ export function useCache(isPage: boolean) {
       // not parent layout
       return cached.get(PAGE_LAYOUT_KEY) || [];
     }
-
     const cacheSet = new Set<string>();
     cacheSet.add(unref(name));
  
     const list = cached.get(unref(name));
+
     if (!list) {
       return Array.from(cacheSet);
     }
     list.forEach((item) => {
       cacheSet.add(item);
     });
+
     return Array.from(cacheSet);
   });
   return { getCaches };
-import { isNavigationFailure, RouteLocationNormalized, Router } from 'vue-router';
+import { RouteLocationNormalized, Router } from 'vue-router';
  
 import { Modal, notification } from 'ant-design-vue';
  
@@ -50,7 +50,7 @@ export function createGuard(router: Router) {
     return true;
   });
  
-  router.afterEach((to, from, failure) => {
+  router.afterEach((to) => {
     // scroll top
     isHash((to as RouteLocationNormalized & { href: string })?.href) && body.scrollTo(0, 0);
  
@@ -60,10 +60,6 @@ export function createGuard(router: Router) {
  
     // change html title
     to.name !== REDIRECT_NAME && setTitle(t(to.meta.title), globSetting.title);
-
-    if (isNavigationFailure(failure)) {
-      console.error('router navigation failed:', failure);
-    }
   });
   createPageLoadingGuard(router);
   createProgressGuard(router);
@@ -35,8 +35,8 @@ export function setupRouter(app: App&lt;Element&gt;) {
   createGuard(router);
 }
  
-router.onError((error) => {
-  console.error(error);
-});
+// router.onError((error) => {
+//   console.error(error);
+// });
  
 export default router;
@@ -55,6 +55,7 @@ const permission: AppRouteModule = {
       component: () => import('/@/views/demo/level/Menu2.vue'),
       meta: {
         title: 'Menu2',
+        // ignoreKeepAlive: true,
       },
     },
   ],
@@ -97,11 +97,13 @@ class Tab extends VuexModule {
     const pageCacheSet = new Set<string>();
     this.tabsState.forEach((tab) => {
       const item = getRoute(tab);
-      const needAuth = !item.meta.ignoreAuth;
+      const needCache = !item.meta.ignoreKeepAlive;
+      if (!needCache) return;
+
       if (item.meta.affix) {
         const name = item.name as string;
         pageCacheSet.add(name);
-      } else if (item.matched && needAuth) {
+      } else if (item.matched && needCache) {
         const matched = item.matched;
         const len = matched.length;
  
@@ -115,7 +117,7 @@ class Tab extends VuexModule {
           }
           if (i < len - 1) {
             const { meta, name } = matched[i + 1];
-            if (meta && (meta.affix || needAuth)) {
+            if (meta && (meta.affix || needCache)) {
               const mapList = cacheMap.get(key) || [];
               if (!mapList.includes(name as string)) {
                 mapList.push(name as string);
@@ -210,7 +212,6 @@ class Tab extends VuexModule {
   @Mutation
   commitRedoPage() {
     const route = router.currentRoute.value;
-
     for (const [key, value] of this.cachedMapState) {
       const index = value.findIndex((item) => item === (route.name as string));
       if (index === -1) {