当前位置: 首页 > news >正文

Vue 路由缓存 防止路由切换数据丢失 路由的生命周期

在切换路由的时候,如果写好了一丢数据在去切换路由在回到写好的数据的路由去将会丢失,这时可以使用路由缓存技术进行保存,这样两个界面来回换数据也不会丢失
在这里插入图片描述

在 < router-view >展示的内容都不会被销毁,路由来回切换数据也不会丢失,但是这样写使用在 < router-view >展示的路由都会被缓存

  <keep-alive><router-view></router-view><!-- 路由器占位符 --></keep-alive>

指定缓存的组件

//User组件
<script>export default ({name: 'User',      })
</script>
<!--include的User是组件名--><keep-alive include="User"><router-view></router-view><!-- 路由器占位符 --></keep-alive>

这种方式只能设置一个或全部缓存 如果想指定两个需要这样操作

 :include="['User','Login']"

路由生命周期

activated(){
//路由被激活时},
deactivated(){
//路由被切换走时}

这两个是路由专有的生命周期,如果组件被缓存,是不会调用created和销毁函数的,这时候可以使用这两个函数

http://www.lryc.cn/news/238759.html

相关文章:

  • 基于ubuntu20.04安装ros系统搭配使用工业相机
  • 网络运维与网络安全 学习笔记2023.11.20
  • 银行业数据分析算法应用汇总
  • 搜索引擎trick:成为搜索高手的秘籍
  • 基于springboot实现冬奥会科普平台系统【项目源码+论文说明】计算机毕业设计
  • 用C++标准库生成制定范围内的整数随机数
  • 使用ExLlamaV2量化并运行EXL2模型
  • 【ARM AMBA AXI 入门 15 -- AXI-Lite 详细介绍】
  • 【开源】基于Vue.js的天然气工程业务管理系统的设计和实现
  • SpringBoot : ch04 整合数据源
  • Docker Swarm总结
  • 特殊token的特殊用途
  • 苹果Siri怎么打开?教你两招轻松唤醒!
  • 分类问题的评价指标
  • Hive 定义变量 变量赋值 引用变量
  • 51单片机LED灯渐明渐暗实验
  • 美团面试:微服务如何拆分?原则是什么?
  • easyExcel注解详情
  • S7-1200PLC 作为MODBUSTCP服务器通信(多客户端访问)
  • 泰勒多项式
  • 【Hello Go】Go语言文本文件处理
  • ppt录屏制作微课,轻松打造精品课程
  • php伪随机数
  • 为什么录屏没声音?实用技巧大放送!
  • 分布式系统的认证授权
  • TVS瞬态抑制二极管的工作原理和特点?|深圳比创达电子EMC
  • csdn - mermaid
  • C题目11:数组a[m]排序
  • 编译器安全
  • docker部署gitlab 12.10.6过程