【vue】keep-alive:true缓存导致页面数据不刷新

keep-alive生命周期钩子函数:activated、deactivated

activated:页面第一次进入的时候,钩子触发的顺序是created->mounted->activated

deactivated: 页面退出的时候会触发deactivated,

当再次前进或者后退的时候只触发activated

使用<keep-alive>会将数据保留在内存中,

如果要在每次进入页面的时候获取最新的数据,

需要在activated阶段获取数据,

承担原来created钩子中获取数据的任务

复制代码
//router

meta:{
    author:'true',
    title:'缓存为true页面',
    keepAlive:'true'
}

//vue

activated(){
    this.getList()
},
相关推荐
qq_124987075317 分钟前
基于springboot+vue的家乡特色旅游宣传推荐系统(源码+论文+部署+安装)
java·前端·vue.js·spring boot·毕业设计·计算机毕设·计算机毕业设计
pas13618 分钟前
38-mini-vue 实现解析 element
前端·javascript·vue.js
We་ct24 分钟前
LeetCode 3. 无重复字符的最长子串:滑动窗口最优解演进与解析
前端·算法·leetcode·typescript
奔跑的web.26 分钟前
前端使用7种设计模式的核心原则
前端·javascript·设计模式·typescript·vue
蜕变菜鸟40 分钟前
折叠页面 css
前端
菩提小狗1 小时前
小迪安全2022-2023|第35天:WEB攻防-通用漏洞&XSS跨站&反射&存储&DOM&盲打&劫持|web安全|渗透测试|
前端·安全·xss
子春一1 小时前
Flutter for OpenHarmony:构建一个专业级 Flutter 节拍器,深入解析定时器、状态同步与音乐节奏交互设计
javascript·flutter·交互
这个昵称也不能用吗?1 小时前
React 19 【use】hook使用简介
前端·react.js·前端框架
web小白成长日记1 小时前
修复 Storybook MDX 中 “does not provide an export named ‘ArgsTable‘” 的实战
前端
Aotman_1 小时前
Vue <template v-for> key should be placed on the <template> tag.
前端·javascript·vue.js