keep-alive配合v-router实现局部缓存与动态请求

<!-- 数组 (使用 `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方法获取组件实例