微客导航 » 文章资讯 » 解决Vue中使用keepAlive不缓存问题

解决Vue中使用keepAlive不缓存问题

2023-07-19 09:11:03 320

1.查看app.vue文件，这个是重点，不能忘记加（我就是忘记加了keep-alive）

2.查看router.js

{
path:'/loanmessage',
component:loanmessage,
name:'loanmessage',
meta:{
keepAlive:true,//代表需要缓存
isBack:false,
},

3.在需要缓存的页面加入如下代码

beforeRouteEnter(to,from,next){
if(from.name=='creditInformation'||from.name=='cityList'){
to.meta.isBack=true;
}
next();
},
activated(){
this.getData()
this.$route.meta.isBack=false
this.isFirstEnter=false

},

附上钩子函数执行顺序：

不使用keep-alive

beforeRouteEnter-->created-->mounted-->destroyed

使用keep-alive

beforeRouteEnter-->created-->mounted-->activated-->deactivated
再次进入缓存的页面，只会触发beforeRouteEnter-->activated-->deactivated。created和mounted不会再执行。

总结

到此这篇关于Vue中使用keepAlive不缓存问题（已解决）的文章就介绍到这了,更多相关Vue使用keepAlive不缓存内容请搜索毛票票以前的文章或继续浏览下面的相关文章希望大家以后多多支持毛票票！

返回顶部
3162201930
czq8825@qq.com

解决Vue中使用keepAlive不缓存问题

热门推荐

随机推荐