没有合适的资源?快使用搜索试试~ 我知道了~
解决Vue中使用keepAlive不缓存问题
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
6 下载量 26 浏览量
2020-10-15
00:30:16
上传
评论
收藏 33KB PDF 举报
温馨提示
试读
1页
主要介绍了Vue中使用keepAlive不缓存问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
资源推荐
资源详情
资源评论
解决解决Vue中使用中使用keepAlive不缓存问题不缓存问题
主要介绍了Vue中使用keepAlive不缓存问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参
考借鉴价值,需要的朋友可以参考下
1.查看app.vue文件,这个是重点,不能忘记加(我就是忘记加了keep-alive)
<template>
<div>
<keep-alive>
<router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"></router-view>
</div>
</template>
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不缓存内容请搜索
我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!
资源评论
weixin_38705252
- 粉丝: 6
- 资源: 931
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功