Vue2.0缓存
来源:互联网 发布:php二维数组排序函数 编辑:程序博客网 时间:2024/06/06 19:00
最近在做一个手机端的网站,遇到页面的缓存问题,自己由于经验不足,走了弯路。由于有些页面需要缓存,有些页面不需要。所以用全局缓存是不行的,必须要使用单页面的缓存。
单页面缓存
本案列适用于跳转到下一页然后回到当前页时需要显示第一次进入本页的信息。
1.在index.js配置路由的文件中设置:
export default new Router( routes: [ { //会员代理 path:'/proxyMember', name:'proxyMember', component:ProxyMember, meta:{proxyMenber: true} //添加一个meta,{}内的内容自己取,值取bull类型 true }, { //个人报表 path:'/personalReport', name:'personalReport', component:PersonalReport, meta:{keepAlive: true,isBack:false} }, ])
2.在app.vue全局的vue文件里设置:
<template > <div id="app"> <!--选择性缓存--> <keep-alive> //缓存标签 <router-view v-if="$route.meta.keepAlive || $route.meta.alive || $route.meta.proxyMenber" ></router-view> //如果是一个页面v-if里面就写一个,多个页面需要缓存就用(或)||连接起来。 </keep-alive> <router-view v-if="!($route.meta.keepAlive) && !($route.meta.alive) && !($route.meta.proxyMenber)"></router-view> //如果是一个页面v-if里面就写一个,多个页面需要缓存就用(非)&&连接起来。 </div></template>
这样你就可以缓存你需要的页面了
全局缓存
……未完待续
阅读全文
0 0
- Vue2.0缓存
- vue2.0
- vue2.0
- vue2.0
- vue2.0缓存数据页面与部分组件不缓存数据页面
- Vue2.0 心法 ==> 第三层:keep-alive 缓存之坑
- vue2.0Demo
- Vue2.0环境搭建
- vue2.0生命周期
- Vue2.0 引用插件
- Vue2.0 配置文件解析
- vue2.0变化
- Vue2.0配置文件解析
- Vue2.0简易案例
- vue2.0 过滤器用法
- vue2.0 自定义指令
- Vue2.0-3-指令
- Vue2.0+CKeditor
- 教你用300万共享单车出行数据,预测骑行目的地 !(附源码)
- 月销量首破14万,7款车销量过万!吉利汽车11月销量141265辆
- 不寒而栗!一代大佬突然公布实情!谁也逃不掉!
- 全球100款大数据工具汇总(前50款)
- 交换机的telnet密码和特权模式密码
- Vue2.0缓存
- Change_Scheduling_Policy
- 邻接表 链式前向星
- 深入浅出学习mysql命令
- 支付宝用大数据憋死伪基站骗子
- 科技部公布首批国家新一代人工智能开放创新平台及战略咨询委员会名单(4家/27位)
- 大数据时代的10个重大变革
- SD卡存储
- 世界互联网大会公布了 18 项全球领先科技成果,10 项来自中国