Vue / keep-alive 组件缓存

在路由配置中设置meta属性

export default[
 {
  path:'/',
  name:'list',
  components: list,
  meta:{
    keepAlive:true //需要被缓存的组件
 },
 {
  path:'/detail',
  name:'detail',
  components: detail,
  meta:{
     keepAlive:false //不需要被缓存的组件
 } 
]

在被keep-alive标签包裹的动态组件或router-view设置是否缓存的判断（我这里是直接在App.vue中全局判断的）

<!-- 需要被缓存的组件 -->
<keep-alive>
    <router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<!-- 不需要被缓存的组件 -->
<keep-alive v-if="!this.$router.meta.keepAlive">
    <router-view v-if="!$route.meat.keepAlive"></router-view>
</keep-alive>