keep-alive清除缓存

1. keep-alive缓存组件的作用

使用vue开发时：有ABC页面，A跳转B，B跳转C，C返回跳转B，B返回跳转A

但是：可能会出下这个问题：从A-B-C正常，但当从B返回A时，会报错，这是因为从B返回A时，传递的参数并不是从A到B的参数

所以：需要将B组件或页面缓存起来，就可以解决这个问题，缓存可以用vue 中的keep-alive标签，使用方法如下：

加上判断条件，如果keepAlive为true，那么就缓存该组件，也就是用keep-alive包裹它
如果为false，那么就不包裹

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

通过设置keepAlive的true或false来决定该组件是否缓存

const routes = [{path: "/",name: "A",component: () => import("@/views"),meta: {keepAlive: false,},},{path: "/B",name: "B",component: () => import("@/views/B"),meta: {keepAlive: true,},},
]

2. keep-alive清除缓存组件的作用

B跳转A页面是，直接清除缓存，则让A页面强制刷新

监听路由跳转，但监听到跳往的页面是A页时，直接刷新

<keep-alive><router-view v-if="$route.meta.keepAlive"></router-view></keep-alive><router-view v-if="!$route.meta.keepAlive"></router-view>``````````````````````````````````````````````````````watch: {$route(to, from) {if (to.name === "B" && from.name) {this.$router.go(0); // 刷新该页面}}
}

keep-alive清除缓存相关推荐

php中的css样式改变无反应,解决ecshop清除缓存css样式没反应问题
部分浏览器例如谷歌或360等双核浏览器会对商城的css样式进行缓存,导致修改了css样式文件也没有更新. 解决方法: 修改includes/init.php 找到 if (!empty($_CFG[' ...
chrome谷歌浏览器用这种方式清除缓存比较方便了，必须是调试模式才行
chrome谷歌浏览器用这种方式清除缓存比较方便了 PS:必须是调试模式才行,可以不是手机模式 ,有些低版本浏览器可能没有这个功能. ------------------------------ 本 ...
前端——解决微信网页清除缓存的方法
前端--解决微信网页清除缓存的方法参考文章: (1)前端--解决微信网页清除缓存的方法 (2)https://www.cnblogs.com/fkcqwq/p/9604184.html 备忘一下.
Nginx平滑升级，并增加清除缓存模块
平滑升级nginx0.8.46到nginx1.0,并增加清除缓存模块 ×××: wget http://labs.frickle.com/files/ngx_cache_purge-1.0.tar.g ...
微信内置浏览器无法清除缓存问题
微信开发比较头疼的一个情况就是缓存难以清除,然而奇怪的是微信app在IOS中是可以刷新页面的,但是Android中却不知道基于什么考虑,无法清除缓存也没有刷新功能,这个就给开发者设置了不小的障碍,哪 ...
php 清除缓存的操作,PHP清除缓存的几种方法
这篇文章主要介绍了PHP清除缓存的几种方法总结的相关资料,希望通过本文大家能够掌握清除缓存的方法,需要的朋友可以参考下 PHP清除缓存的几种方法总结现在开发的项目是用tp3.1版本的,在开发过程中我 ...
Android清除缓存功能来实现
我们都知道在Android的设置->应用程序中能够查看应用程序的相关信息,当中有一个功能是清除缓存. 如图: 怎么实现这些功能呢,从Android的setting源代码中能够得到相关信息. 实现 ...
Chrome 技术篇-常用web调试技巧清除缓存并硬性重新加载
chrome 按 F12 打开开发者工具的条件下,右键浏览器刷新会有 3 个选择: 正常重新加载,走缓存的: 硬性重新加载,清除了关键位置的缓存: 清空缓存并硬性重新加载,是清除全部缓存并重新加载: ...
实战SSM_O2O商铺_47【Redis缓存】清除缓存接口的开发
文章目录概述接口层改造 CacheService接口 CacheService接口实现类工具类中的方法单元测试 Github地址概述设计如下: 在接口层传入缓存key的前缀,通过匹配的方式 ...
flask html css文件更改后（谷歌）浏览器不及时更新样式文件怎么办？（ctrl+shift+delete清除缓存的图片和文件）
如果是css文件更改后以谷歌浏览器为例按ctrl+shift+delete 清除缓存的图片和文件,再按f5刷新浏览器,搞定! 但是如果是html文件更改,就要重新启动一下后端flask程序了

keep-alive清除缓存

keep-alive清除缓存相关推荐

最新文章

热门文章