【Vue】通过keep-alive实现路由组件的数据缓存
2023-09-11 14:14:57 时间
1、在<router-view></router-view>加入keep-alive
<!-- 注意:include缓存的是组件名 -->
<keep-alive include="Menu_1">
<router-view></router-view>
</keep-alive>
2、如果缓存多个路由组件名
<keep-alive include="['Menu_1','Menu_2']">
3、全局缓存 - App.vue组件中加入keep-alive标签
<div id="app">
<keep-alive>
<div>
...
</div>
</keep-alive>
</div>
相关文章
- (尚043) vue_向路由组件传递数据+vue param和query两种传参方式
- (尚042) vue_缓存路由组件
- (尚031)Vue_案例_自定义事件(组件间通信第2种方式:vue自定义事件)
- [转] vue自定义组件(通过Vue.use()来使用)即install的使用
- Vue 嵌套路由、路由守卫
- 【Vue】通过“全局路由守卫”实现路由组件”切换“时的”权限控制“
- 【Vue】路由组件通过props配置传参(图文+代码)
- 【Vue】路由组件传参(Query和Params)及路由命名name的用途(图文+代码)
- vue-cli webpack 中全局引入 jquery
- uni-app - H5 页面路由不存在时,跳转到自己定制的 404.vue 页面(当路由不存在时自动重定向到自定义的 404 组件)超详细简约高效的解决方案
- vue.js-详解三大流行框架VUE_快速进阶前端大咖-Vue基础
- TP5.1+Vue前后端分离实践
- vue--去除input输入框--空格--适用于搜索查询框
- 【Vue】vue组件和vue插件的创建和使用(底部栏组件、Toast 和 Notify通知插件)
- vue文档摘录九:Vue Router
- Vue的过滤器、生命周期钩子函数、组件开发、路由、Promise基本使用语法
- 解决:Vue调试工具vue-devtools安装方法——解决下载速度缓慢,安装报错问题
- Vue路由导航报错:NavigationDuplicated: Avoided redundant navigation to current location解决方法
- Vue学习第14天——vue自定义事件及详细代码演示
- 详解基于vue,vue-router, vuex以及addRoutes进行权限控制