vue-element-admin 快捷导航(标签栏导航)切换不刷新问题
后台开发框架是vue-element-admin,在使用标签导航时发现会刷新页面,但是如果是在编辑表单时切换标签导航会导致表单数据因为刷新而需要重新填写,这就很难搞了,所以需要切换标签导航时页面不刷新。然后百度了一下发现和官方文档说明一样,需要路由的name与对应页面的name一致,并设置路由的meta里面noCache为false
但是咱也不知道啥原因,按照这样配置并没有用,来回切换标签栏导航还是会刷新,经过反复阅读文档以及百度之后就采用以下方式解决了
<!-- layout/components/AppMain.vue 文件 -->
<!-- 去掉:include="cachedViews" -->
<keep-alive :include="cachedViews"><router-view :key="key" />
</keep-alive>
<!-- 改成如下 -->
<keep-alive><router-view :key="key" />
</keep-alive>
如上,问题解决了,按文档来说,直接使用keep-alive也是有弊端的,但是问题不大,好歹解决问题了
关于动态删除keep-alive缓存
参考官方文档:https://panjiachen.github.io/vue-element-admin-site/zh/guide/essentials/tags-view.html#visitedviews-cachedviews
参考百度结果:https://blog.csdn.net/weixin_41766902/article/details/123595051
vue-element-admin 快捷导航(标签栏导航)切换不刷新问题相关推荐
- vue element admin登录方式切换(密码登录或短信登录)
显示结果: 具体代码可以根据vue element admin源码进行更改,下面是页面代码 <el-form ref="loginForm" :model="log ...
- Vue Element Admin 使用mock模块模拟数据
Mock 数据是前端开发过程中必不可少的一环,是分离前后端开发的关键链路.通过预先跟服务器端约定好的接口,模拟请求数据甚至逻辑,能够让前端开发更加独立自主,不会被服务端的开发所阻塞. vue-elem ...
- vue+element+admin(初始化项目)
2022.10.17我接触到了vue+element+admin的使用,首先要安装node.jshttps://nodejs.org/zh-cn/download/.和githttps://git-s ...
- 前端学习(3030):vue+element今日头条管理-顶部导航栏布局
- 前端学习(3029):vue+element今日头条管理-顶部导航栏布局
- 前端学习(3026):vue+element今日头条管理-让导航栏和路由对应起来
- 前端学习(3025):vue+element今日头条管理-侧边导航菜单
- Vue+Element实现tab页多页面切换
效果图GIF 源码地址 https://gitee.com/marlife/nav-tags.git 已经上传到Gitee(码云),代码拉下来之后: 1.执行安装命令:npm install 2.执行 ...
- Vue Element Admin 添加侧边栏以及他的页面
1. 在 /src/views/ 下添加需要的页面 2. 配置路由器 router 中的路由表 routes,分为 constantRoutes 和 asyncRoutes. 将路由的配置信息添加进路 ...
最新文章
- nginx日志切割定时执行脚本
- 微信小程序:一个json帮你完成分享朋友圈图片
- 为静态博客生成器WDTP移植了一款美美哒主题
- idea tomcat部署web项目_项目开发之部署帆软到Tomcat服务一
- Suricata的初始化脚本
- 列表输出循环左移_python 列表推导式(经典代码)(21)
- 楼宇自控ba系统 服务器,楼宇自控BA系统
- android Baseadapter 和 ViewHolder的使用
- 计算机视觉中的特征提取方式
- javascript 基础之手机端相关事件-touch(详细篇)(1)
- java反编译工具那个好用_Java反编译工具有哪些,Java反编译工具好用推荐
- 交互设计精髓pdf百度云_About Face 4:交互设计精髓 (Alan cooper艾伦·库伯等) 中文pdf扫描版[139MB]...
- 导入数据库时报错的解决办法汇总
- 2021-07-18
- 机器码解除教程,逃离塔科夫机器码解除,彩虹6号机器码解除,dayz机器码解除,腐蚀rust机器码解除
- Android 裁剪摄像头预览窗口-SurfaceView
- mirrorlink
- Codeforces 128 A Statues【预处理+Bfs】
- keil编译器CODE、RO、RW、ZI的含义
- 简单爬虫--爬取百度热点新闻标题
热门文章
- asp.net师电子化信息库的设计与实现(源代码+论文)ASP.NET汽车销售管理系统的设计与开发(源代码+论文)
- 怎么给图片换背景?点开收货一些新方法
- 编程到底学的是什么,主次又是什么
- qprocess qt 打开word_Qt QProcess启动和关闭外部程序
- CMU-MOSEI数据集解读
- readxl包导入excel报错Error: `path` does not exist解决方法
- Spring_Ioc基本配置使用(基于xml)
- redis cluster 集群 HA 原理和实操(史上最全、面试必备)
- CDN加速和买胡萝卜的关系
- Learning Photoshop Elements 15 Photoshop Elements 15教程 Lynda课程中文字幕