关于vue里页面的缓存详解


Posted in Javascript onNovember 04, 2019

keep-alive是vue内置的一个组件,可以使被它包含的组件处于保留状态,或避免被重新渲染。

用法:

关于vue里页面的缓存详解

运行结果描述:

关于vue里页面的缓存详解 input输入框内,路由切换输入框内部的内容不会发生改变。

在keep-alive标签内部添加

include:字符串或正则表达式。只有匹配的组件会被缓存

exclude: 字符串或正则表达式。任何匹配的组件都不会被缓存。

结合router缓存部分页面:

比较实用的例子:

思路:通过beforeRouterLeave这个钩子来对路由里面的keepAlive进行赋值。从而动态的确定A页面是否需要被缓存。

关于vue里页面的缓存详解

结合router缓存部分页面:

关于vue里页面的缓存详解

比较实用的例子:

关于vue里页面的缓存详解

思路:通过beforeRouterLeave这个钩子来对路由里面的keepAlive进行赋值。从而动态的确定A页面是否需要被缓存。

关于vue里页面的缓存详解

以上这篇关于vue里页面的缓存详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
event.keyCode键码值表 附只能输入特定的字符串代码
May 15 Javascript
比Jquery的document.ready更快的方法
Apr 28 Javascript
javascript和jquery修改a标签的href属性
Dec 16 Javascript
深入理解$.each和$(selector).each
May 15 Javascript
详解Angular中$cacheFactory缓存的使用
Aug 19 Javascript
总结js中的一些兼容性易错的问题
Dec 18 Javascript
JavaScript 高性能数组去重的方法
Sep 20 Javascript
mpvue开发音频类小程序踩坑和建议详解
Mar 12 Javascript
JavaScript获取页面元素的常用方法详解
Sep 28 Javascript
layui 解决富文本框form表单提交为空的问题
Oct 26 Javascript
javascript设计模式 ? 解释器模式原理与用法实例分析
Apr 17 Javascript
vue实现登录、注册、退出、跳转等功能
Dec 23 Vue.js
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
Nov 04 #Javascript
解决vue更新路由router-view复用组件内容不刷新的问题
Nov 04 #Javascript
vue实现权限控制路由(vue-router 动态添加路由)
Nov 04 #Javascript
Vue路由对象属性 .meta $route.matched详解
Nov 04 #Javascript
element-ui table组件如何使用render属性的实现
Nov 04 #Javascript
Vue 解决多级动态面包屑导航的问题
Nov 04 #Javascript
vue+elementUI动态生成面包屑导航教程
Nov 04 #Javascript
You might like
PHP中的array数组类型分析说明
2010/07/27 PHP
PHP小教程之实现链表
2014/06/09 PHP
php生成唯一的订单函数分享
2015/02/02 PHP
php去掉文件前几行的方法
2015/07/29 PHP
php文件缓存方法总结
2016/03/16 PHP
初识PHP中的Swoole
2016/04/05 PHP
PHP操作路由器实现方法示例
2019/04/27 PHP
jQuery学习笔记 操作jQuery对象 文档处理
2012/09/19 Javascript
jquery插件validate验证的小例子
2013/05/08 Javascript
从jquery的过滤器.filter()方法想到的
2013/09/29 Javascript
coffeescript使用的方式汇总
2015/08/05 Javascript
js学习阶段总结(必看篇)
2016/06/16 Javascript
微信小程序 开发工具快捷键整理
2016/10/31 Javascript
创建简单的node服务器实例(分享)
2017/06/23 Javascript
jQuery.Ajax()的data参数类型详解
2017/07/23 jQuery
react-native组件中NavigatorIOS和ListView结合使用的方法
2017/09/30 Javascript
webstorm中配置nodejs环境及npm的实例
2018/05/15 NodeJs
vue基础之事件v-onclick="函数"用法示例
2019/03/11 Javascript
js实现Element中input组件的部分功能并封装成组件(实例代码)
2021/03/02 Javascript
在Python中使用成员运算符的示例
2015/05/13 Python
学习python之编写简单乘法口诀表实现代码
2016/02/27 Python
python中异常报错处理方法汇总
2016/11/20 Python
详解python实现小波变换的一个简单例子
2019/07/18 Python
pytorch使用指定GPU训练的实例
2019/08/19 Python
python飞机大战pygame游戏框架搭建操作详解
2019/12/17 Python
汇集了世界上最好的天然和有机美容产品:LoveLula
2018/02/05 全球购物
Ajax请求总共有多少种Callback
2016/07/17 面试题
金额转换,阿拉伯数字的金额转换成中国传统的形式如:(¥1011)-> (一千零一拾一元整)输出
2015/05/29 面试题
两道JAVA笔试题
2016/09/14 面试题
绩效工资分配方案
2014/01/18 职场文书
关于毕业的中学校园广播稿
2014/01/26 职场文书
给全校老师的建议书
2014/03/13 职场文书
中国入世承诺
2014/04/01 职场文书
个人四风问题整改措施思想汇报
2014/10/04 职场文书
2015秋季幼儿园开学寄语
2015/03/25 职场文书
安全生产感想
2015/08/07 职场文书