<!-- 数组 (使用 `v-bind`) -->
<keep-alive :include="['a', 'b']">
<component :is="view"></component>
</keep-alive>
注:这里的a,b指想要缓存的组件的name即
export default {
name:a,
data(){
return {}
} ,
...
}
a组件被缓存之后,a组件的接口想要继续请求的话就要使用activaded,如果c组件进入a组件不想缓存的话就要在beforeRouteEnter之中重新定义初始值如data里的
activated(){
this.getData();
},
beforeRouteEnter (to, from, next) {
next(vm => {
if(from.name == 'a'){
vm.keepAlive = vm.$route.meta.keepAlive;
}else{
vm.keepAlive = false;
};
if(!vm.keepAlive){
vm.currentPage=1,
vm.pageSize=10,
vm.form.typeName='',
}
})
},
这里使用vm是为了介绍可以通过next方法获取组件实例