每次使用返回是页面总是会刷新 导致了一些体验上的不愉快

现在 发现vue中的一个很方便的方法还可以用来优化性能就是：

keep-alive缓存组件

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

<keep-alive>

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

</keep-alive>

这边我是用作缓存页面，返回不刷新，这里我只缓存keepAlive的值为true的页面

在路由的meta属性加入keepAlive，希望缓存的页面加入vue属性即可

如果需要改变时在

beforeRouteEnter，beforeRouteLeave中写入事件即可

如果页面需要再加载数据则activated事件中写入你的方法

vue的组件缓存（返回页面不刷新）的更多相关文章

  1. vue中keepAlive的用法[返回页面不刷新]

    本文转载于時間蒼白了誓言_49b9 使用vue单页开发项目时遇到一个问题:在列表页进入详情页,按返回键返回列表页时页面刷新了,用户体验非常差啊!!!查阅了一下相关问题,使用解决这个问题,下面是我的使用 ...

  2. vue中如何缓存一些页面

    在vue中,有时候我们只想缓存页面中的一些组件或页面,这个时候怎么办呢,我们就需要用判断来加载keep-alive. 例如: // router.js { path: "/driving_l ...

  3. 关于微信小程序返回页面时刷新页面的实现

    在小程序开发中,我们通常会遇到这样的需求:提交某个表单成功后跳转该表单详情页面,但是返回时需要跳转回到首页(注意:我这里的首页是提交表单页的前一个页面),而不能再返回提交表单的页面,并且要在首页中刷新 ...

  4. vue tab栏缓存解决跳转页面后返回的状态保持

    <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...

  5. vue中使用keepAlive组件缓存遇到的坑

    项目开发中在用户由分类页category进入detail需保存用户状态,查阅了Vue官网后,发现vue2.0提供了一个keep-alive组件. 上一篇讲了keep-alive的基本用法,现在说说遇到 ...

  6. Vue keep-alive如何实现只缓存部分页面

    prop: include: 字符串或正则表达式.只有匹配的组件会被缓存. exclude: 字符串或正则表达式.任何匹配的组件都不会被缓存. 在2.1.0版本Vue中 常见用法: // 组件 exp ...

  7. Vue 页面 前进刷新 后退不刷新（keepAlive）

    前言 遇到这一个个问题  需要是这样的 Vue里面的不刷新问题 页面分为: A 主页  B列表页  C 详情页 A  beforeRouteLeave 时设置 to.meta.keepAlive = ...

  8. angular页面缓存与页面刷新

      angularJS学习笔记:页面缓存与页面刷新 遇到的问题 现在存在这样一个问题,登录前与登录成功后是同一个页面,只不过通过ngIf来控制哪部分显示,图像信息如下: 所以,整体工作不是很难,无非就 ...

  9. vue 2.0 路由切换以及组件缓存源代码重点难点分析

    摘要 关于vue 2.0源代码分析,已经有不少文档分析功能代码段比如watcher,history,vnode等,但没有一个是分析重点难点的,没有一个是分析大命题的,比如执行router.push之后 ...

随机推荐

  1. 安装SQL Server 2008R2 报错“此计算机上安装了 Microsoft Visual Studio 2008 的早期版本”解决方法

    安装SQL Server 2008 R2报错“此计算机上安装了 Microsoft Visual Studio 2008 的早期版本,请在安装 SQL Server 2008 前将 VS2008 升级 ...

  2. 升级Kubernetes 1.18前，你不得不知的9件事

    本文来自Rancher Labs 昨天Kubernetes最新版本v1.18已经发布,其包含了38项功能增强,其中15项为稳定版功能.11项beta版功能以及12项alpha版功能.在本文中,我们将探 ...

  3. 几十万学费总结出来的Ddos攻击防护经验！

    本人从事网络安全行业十余年年.有十年被骗经验.被骗了很多回(都说能防300G,500G,买完就防不住了),本文当然重点给大家说明,ddos攻击是什么,中小企业如何防护,用到成本等. 言归正传 首先我们 ...

  4. Burpsuite被动扫描流量转发插件：Passive Scan Client

    编译成品:链接: https://pan.baidu.com/s/1E0vsPGgPgB9bXCW-8Yl1gw 提取码: 49eq Passive Scan Client Burpsuite被动扫描 ...

  5. u库前戏

    u库 ORM:对象关系映射 类 >>> 数据库的一张表 对象 >>> 表的一条记录 对象点属性 >>> 记录某一个字段对应的值 ''' 对象就是一 ...

  6. JSP（三）----EL表达式

    ##  EL表达式 1.概念:Expression  alnguage  表达式语言 2.作用:替换和简化JSP页面中java代码的编写 3.语法:${表达式} 4.注意: *  jsp默认支持EL表 ...

  7. 动态规划-不连续最大子序列和-打家劫舍系列-1388. 3n 块披萨

    2020-03-24 17:49:58 198. 打家劫舍 问题描述: 你是一个专业的小偷,计划偷窃沿街的房屋.每间房内都藏有一定的现金,影响你偷窃的唯一制约因素就是相邻的房屋装有相互连通的防盗系统, ...

  8. 阿里云服务器Ubuntu系统搭建LNMP环境

    目录 一.Nginx 安装 二.MySQL安装 三.PHP安装 四.配置Nginx 五.环境测试 六.服务器常用路径 一.Nginx 安装 更新软件源 sudo apt-get update 安装 N ...

  9. 面试刷题25:jvm的垃圾收集算法？

    垃圾收集是java语言的亮点,大大提高了开发人员的效率. 垃圾收集即GC,当内存不足的时候触发,不同的jvm版本算法和机制都有差别. 我是李福春,我在准备面试,今天的问题是: jvm的垃圾回收算法有哪 ...

  10. HIT软件构造课程3.2总结（Designing Specificaton）

    本节转向“方法/函数/操作”如何定义 上一节是名词 这一节是动词 1.编程语言中的函数和方法 方法 使用者不需要知道方法内部如何实现,这叫做“抽象”. 参数 参数类型是否匹配,在静态检查时完成. 返回 ...