当前位置: 移动技术网 > IT编程>脚本编程>vue.js > vue-router keep-alive

vue-router keep-alive

2020年08月10日  | 移动技术网IT编程  | 我要评论
用的vue-router 3.0.1版本,网上搜到的版本都是下面这样<keep-alive > <router-view v-if="$route.meta.keepAlive"></router-view></keep-alive> <router-view v-if="!$route.meta.keepAlive"></router-view>不管是把上面v-if 放到 keep-alive 还

用的vue-router 3.0.1版本,网上搜到的版本都是下面这样

<keep-alive >
   <router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
         
<router-view v-if="!$route.meta.keepAlive"></router-view>

不管是把上面v-if 放到 keep-alive 还是 放在router-view 里面,都会有些奇怪都现象,要么设置成 keepAlive false的控件不能加载进去,要么明明设置成keepAlive true 的页面 返回的时候刷新了,估计还是这种写法有问题。

没办法只能换方案了,看到keep-alive 有include 和exclude属性,看字面意思也知道了,include 是包含页面名称做缓存,exclude 是排除名称做缓存,于是改成下面的

<keep-alive :include="['product','book']">
    <router-view></router-view>
</keep-alive>

但页面还是刷新了,路由里已经设置了name了,后来试着在 vue component 中 加个name属性,和data平级,就有效果了。

本文地址:https://blog.csdn.net/jam476/article/details/107878003

如您对本文有疑问或者有任何想说的,请点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网