update: keep alive

src/components/layout/index.vue

@@ -6,7 +6,7 @@
       <bread-menu v-if="activedMenu.length > 3" :menu-list="activedMenu.slice(2)"></bread-menu>
       <div class="hb-layout-pager" id="hb-layout-pager-one" :style="{ height: activedMenu.length > 3 ? `calc(100% - 30px)` : '100%', 'padding-bottom': pagePaddingBottom }">
         <!-- 页面内容 -->
-        <keep-alive :exclude="keepAlive">
+        <keep-alive :include="keepAlive">
           <router-view :key="$route.path" :brand-id="enterpriseId"></router-view>
         </keep-alive>
       </div>
@@ -27,7 +27,7 @@ export default {
   provide: () => provideData,
   beforeRouteUpdate(to, from, next) {
     if (Array.isArray(to.meta.fromPath)) {
-      to.meta.fromPath.some(el => {
+      const isKeepAlive = to.meta.fromPath.some(el => {
         let menuUrlReg = el;
         let pathConfigReg = /(:.*)(\/?)/;
         const pathRegStr = '([\\d\\w]+[\\-]*[\\d\\w]*)';
@@ -39,15 +39,15 @@ export default {
           menuUrlReg = menuUrlReg.replace(pathConfigReg, `${pathRegStr}$2`);
         }
         const reg = new RegExp(`^${menuUrlReg}$`);
-        if (reg.test(from.path)) {
-          this.keepAlive = [];
-        } else {
-          this.keepAlive = [to.meta.componentName];
-        }
         return reg.test(from.path);
       });
+      if (!isKeepAlive) {
+        this.keepAlive = this.keepAlive.filter(el => el != to.meta.componentName);
+      }
       setTimeout(() => {
-        this.keepAlive = [];
+        if (this.keepAlive.every(el => el != to.meta.componentName)) {
+          this.keepAlive.push(to.meta.componentName);
+        }
       }, 100);
     }
     next();
@@ -91,6 +91,9 @@ export default {
     }
   },
   created() {
+    if (Array.isArray(this.$route.meta.fromPath)) {
+      this.keepAlive.push(this.$route.meta.componentName);
+    }
     this.$router.beforeEach((to, from, next) => {
       this.activedMenu = this.getActivedMenu(this.getMenuByPath(to.path.slice(1)));
       next();