1、首先在App.js里面,这里是根据route里面meta.keepAlive是否为true来判断是否需要缓存。
<div>
<keep-alive>
<router-view v-if="$route.meta.keepAlive"/>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"/>
</div>
2、在router.js路由里面meta加上keepAlive,默认可以为有缓存
{
path: '/xxxx',
name: 'xxxx',
component: xxxx,
meta: {
keepAlive:true,
}
}
3、使用路由守卫,判断跳转前的页面(特定页面)name值,修改是否需要缓存
beforeRouteLeave(to,from,next){
// console.log(to,from)
if(to.name == 'XXX'){
from.meta.keepAlive = false
next()
}else{
from.meta.keepAlive = true
next()
}
}