vue页面缓存问题，开启时缓存页面，关闭时关闭缓存，再开启时刷新

1、路由

        <keep-alive>

          <router-view v-if="$route.meta.notCache"></router-view>

          </keep-alive>

          <router-view v-if="!$route.meta.notCache"></router-view>

2、数据状态

       {

    path: '/ST01',

    name: 'ST01',

    component: Main,

    children: [{

      path: '/ST01',

      meta: {

        moduleCode: '001',

        hideInMenu: true,

        title: '学员列表',

        notCache: true            //  这里是否缓存

      },

      name: 'ST01',

      component: () => import('../views/pages/ST01.vue')

    }]

  }

3、在需要关闭页面时，同时关闭缓存的情况下，

4、然后对应的每个需要缓存页面中

beforeRouteEnter(to, from, next){

  //设置页面缓存

to.meta.notCache = true;

next();

  },

  beforeRouteLeave(to, from, next) {

//删除页面缓存

// from.name是路由中name，也就是页面的路由名

if (from.name === 'ST01' && !from.meta.notCache) {

if(this.$vnode.parent && this.$vnode.parent.componentInstance && this.$vnode.parent.componentInstance.cache){

var key = this.$vnode.key == null

            ? this.$vnode.componentOptions.Ctor.cid + (this.$vnode.componentOptions.tag ? `::${this.$vnode.componentOptions.tag}` : '')

            : this.$vnode.key;

var cache = this.$vnode.parent.componentInstance.cache;

var keys  = this.$vnode.parent.componentInstance.keys;

if (cache[key]){

    if (keys.length) {

        var index = keys.indexOf(key);

        if (index > -1) {

            keys.splice(index, 1);

        }

    }

    delete cache[key];

}

}

this.$destroy()

    }

    next();

  }