页面缓存测试

src/App.vue

 <template>
   <div id="app" class="dm-reset-style">
-    <router-view></router-view>
+    <keep-alive :include="keepAlive">
+      <router-view :key="$route.path"></router-view>
+    </keep-alive>
   </div>
 </template>
 
@@ -9,7 +11,11 @@ import { mapState } from 'vuex';
 
 export default {
   name: 'App',
-
+  data() {
+    return {
+      keepAlive: []
+    }
+  },
   computed: {
     ...mapState([
       'uniqueId'
@@ -17,6 +23,11 @@ export default {
   },
 
   created() {
+    this.setKeepAlive(this.$route, {});
+    this.$router.beforeEach((to, from, next) => {
+      this.setKeepAlive(to, from);
+      next();
+    });
     this.baseUrl = window.location.origin.indexOf('localhost') > -1 ? 'http://www.gicdev.com' : window.location.origin;
     this._getUserInfo();
     this.changeTab();
@@ -24,6 +35,32 @@ export default {
   },
 
   methods: {
+    setKeepAlive(to, from) {
+      if (Array.isArray(to.meta.fromPath)) {
+        const isKeepAlive = to.meta.fromPath.some(el => {
+          let menuUrlReg = el;
+          let pathConfigReg = /(:.*)(\/?)/;
+          const pathRegStr = '([\\d\\w]+[\\-]*[\\d\\w]*)';
+          while (pathConfigReg.test(menuUrlReg)) {
+            menuUrlReg = menuUrlReg.replace(pathConfigReg, `${pathRegStr}$2`);
+          }
+          pathConfigReg = /(\/\*)(\/?)/;
+          while (pathConfigReg.test(menuUrlReg)) {
+            menuUrlReg = menuUrlReg.replace(pathConfigReg, `${pathRegStr}$2`);
+          }
+          const reg = new RegExp(`^${menuUrlReg}$`);
+          return reg.test(from.path);
+        });
+        if (!isKeepAlive) {
+          this.keepAlive = this.keepAlive.filter(el => el != to.meta.componentName);
+        }
+        setTimeout(() => {
+          if (this.keepAlive.every(el => el != to.meta.componentName)) {
+            this.keepAlive.push(to.meta.componentName);
+          }
+        }, 100);
+      }
+    },
     isEditClique() {
       this.axios.get(`${this.baseUrl}/api-member/allow-edit-clique-grade?requestProject=member`).then((res) => {
         if (res.data.errorCode == 0) {

src/components/wechatmembers/abnormal-member/abnormal-member-list/abnormal-member.js

@@ -96,11 +96,11 @@ export default {
         sessionStorage.getItem("abnormalListSearchData")
       );
     }
-    if(sessionStorage.getItem("abnormalListSearchDateRange")){
-      this.dateValue = JSON.parse(
-        sessionStorage.getItem("abnormalListSearchDateRange")
-      );
-    }
+    // if(sessionStorage.getItem("abnormalListSearchDateRange")){
+    //   this.dateValue = JSON.parse(
+    //     sessionStorage.getItem("abnormalListSearchDateRange")
+    //   );
+    // }
   },
   beforeMount() {
     this.init();
@@ -119,11 +119,11 @@ export default {
         if(value[0] && value[1]){
           this.searchData.startDate = +value[0];
           this.searchData.endDate = +value[1];
-          sessionStorage.setItem("abnormalListSearchDateRange",JSON.stringify([+value[0],+value[1]]));
+          // sessionStorage.setItem("abnormalListSearchDateRange",JSON.stringify([+value[0],+value[1]]));
         }else{
           this.searchData.startDate = '';
           this.searchData.endDate = '';
-          sessionStorage.removeItem("abnormalListSearchDateRange");
+          // sessionStorage.removeItem("abnormalListSearchDateRange");
         }
       }
     },

src/router/index.js

@@ -123,6 +123,8 @@ export const constantRouterMap = [
         component: _import('wechatmembers', 'frozen-member/frozen-list/frozen-list'),
         meta: {
           title: '冻结会员列表',
+          componentName: 'forzenlist',
+          fromPath: ['/customersDetail','/frozenWhiteList','/frozenList/frozenMember'],
         },
       },
       {
@@ -130,6 +132,8 @@ export const constantRouterMap = [
         component: _import('wechatmembers', 'frozen-member/white-list/white-list'),
         meta: {
           title: '冻结会员白名单',
+          componentName: 'frozenMemberWhiteList',
+          fromPath: ['/customersDetail'],
         },
       },
       {
@@ -137,6 +141,8 @@ export const constantRouterMap = [
         component: _import('wechatmembers', 'frozen-member/frozen-member/frozen-member'),
         meta: {
           title: '冻结会员',
+          componentName: 'frozen-member',
+          fromPath: ['/customersDetail'],
         },
       },
       {
@@ -315,6 +321,8 @@ export const constantRouterMap = [
         component: _import('wechatmembers', 'abnormal-member/abnormal-member-list/abnormal-member'),
         meta: {
           title: '异常会员列表',
+          componentName: 'abnormal-member-list',
+          fromPath: ['/abnormal-setting','/customerDetail'],
         },
       },
       {