vue页面缓存设置,动态设置页面缓存

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue页面缓存设置,动态设置页面缓存相关的知识,希望对你有一定的参考价值。

参考技术A 情景:A页面—>B页面—>C页面,A页面去B页面期望B页面不缓存,B页面去C页面时,期望B页面可以被缓存。(实际场景可以是:A为首页,B为列表页,C为详情页,B滚动翻页后,从C返回B,记录滚动位置。)
通过路由访问钩子设置B页面的keepAlive为true或者false。
离开路由后,判断to.name是否是A的路由名,是的话设置为false,否则设置为true。注意B页面的keepAlive要设置为true。

2.通过vuex结合路由的includes功能以及路由钩子函数实现。(推荐,实现起来优雅)
3.声明一个初始化页面状态,内部变量的函数,从a 页面进入执行初始化函数,其余情况不执行。视图依赖数据驱动,所以可以实现效果。

以上是关于vue页面缓存设置,动态设置页面缓存的主要内容,如果未能解决你的问题,请参考以下文章

keepAlive动态缓存及清除缓存

解决vue keepAlive 二次进入页面显示首次缓存问题

vue A、B、C三个页面keepAlive、include页面缓存问题

关于vue后退不刷新,并缓存原有状态,前进刷新并请求新数据

浏览器缓存常用策略及Vue应用的Nginx缓存设置

页面的缓存与不缓存设置