vue中keep-alive中缓存的组件可以主动销毁吗？

Question

在项目中使用会缓存个别路由组件，代码如下：

      `<transition name="fade" mode="out-in">
        <keep-alive>
            <router-view v-if="$route.meta.keepAlive"></router-view>
        </keep-alive>
    </transition>
    <transition name="fade" mode="out-in">
        <router-view v-if="!$route.meta.keepAlive"></router-view>
    </transition>`
    
    这儿有一个问题就是：如果我想主动把keep-alive中的个别组件手动销毁，还没有什么方法和头绪。麻烦各位了~~

Answer 1

在vue@2.5.0 中 keep-alive 新增了一个 max 属性可以设置 cache instance 的个数

add max prop for <keep-alive> for limiting max number of instances cached

相关issue

所以个人认为没有太大必要手动来维护 keep-alive的组件，当然你想的话可以使用include 和 exclude 来实现

Answer 2

如果是要刷新数据的话，请通过url传参并通过"watch":"$route"监听事件

    watch: {
      '$route' (to, from) {
        // 对路由变化作出响应...
      }
    }

Answer 3

请问最后怎么解决的？

Answer 4

用include和exclude来动态改变缓存条件

Answer 5

使用这个库可以实现keep-alive组件自动管理，返回上一个页面时自动销毁 keep-alive-helper