Vue-element-admin 标签页切换时，表单数据丢失问题

最新推荐文章于 2024-01-30 13:27:30 发布

DevZYD

最新推荐文章于 2024-01-30 13:27:30 发布

阅读量2.9k

点赞数 1

分类专栏： vue-element-admin 问题解决记录文章标签： vue elementui js html

本文链接：https://blog.csdn.net/qq_36949621/article/details/118681219

版权

vue-element-admin 问题解决记录专栏收录该内容

2 篇文章 0 订阅

订阅专栏

一、问题现象：

当打开多个标签页时，在一个页面输入框输入内容筛选搜索了数据，切换到其他页面再切换回搜索数据的页面，将会发现筛选查询输入框内容已丢失。

二、导致问题出现的原因：

路由配置name参数和对应访问vue文件内的name参数值不同导致

三、解决方法：

将路由配置 name参数和对应访问vue文件内的name参数改为一样即可，另外一方面，设置路由配置meta参数对象中noCache为false

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

DevZYD

关注关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

Vue和Vue-Element-Admin（一）：Vue基础和框架

叶子叶来

10-27

9668

前后端开发容易有成就感，对前端的变魔术式的展示效果和开发一直很感兴趣，奈何毕业后3年都在做大数据平台和数据分析相关的东西，全是业务思路没有IT思路；当前项目涉及了2个前端展示系统，基于vue-element-admin的前端框架进行前后端分离开发，选择vue-element-admin框架，它是一个vue+element ui的开源技术方案：vue-element-admin 码云地址，教程：vue-element-admin教程，下载即可运行，熟悉vue开发模式即可快速上手，界面看起来比较简洁清爽。.

Vue及Element UI&vue-element-admin简记

生活在别处

11-21

7104

文章目录概念索引安装vue基本语法声明式渲染动态参数双向绑定数据绑定中进行数据处理使用JS表达式计算属性侦听器Class 与 Style 的数据绑定Class的数据绑定Style的数据绑定条件与循环条件渲染v-if指令v-show指令列表（数组）渲染数据更新检测事件监听器修饰符事件修饰符按键修饰符按键码系统修饰键指令的缩写组件化应用构建vue实例实例生命周期的钩子模板语法高级语法相关概念HTML ...

参与评论您还未登录，请先登录后发表或查看评论

vue实现跳转新的标签页

M612a34的博客

07-23

4846

一般单页面应用，例如vue都是通过vue-router来做跳转，不会像多页应用一样另起新页面显示，但是也不排除一些业务上的需要。一般情况下单页面应用的路由跳转我们都是通过简单的一句话搞定： this.$router.push({name: 'abc'}) vue router是为单页面应用设计的，不管是push,replace都是在一个tab页面内进行的。所以，没有直接打开一个新页面的...

vue+elementui tab切换丢失参数

weixin_48271592的博客

06-30

3202

vue+elementui列表跳详情后，点其他菜单进行tab切换丢失详情页参数

vue-element-admin 切换tag标签时，页面刷新丢失解决办法

STR少寒的博客

12-18

2563

vue-element-admin 切换tag标签时，页面刷新丢失解决办法设置路由中meta的noCache属性改成false 要在script设置统一的name名称

关于翻页之后表格重新加载，之前选中的项丢失的问题处理

weixin_34362790的博客

06-15

577

项目中使用jqGrid制作表格，当添加用户，欲添加用户分布在不同页，翻页选择所有欲添加用户，点击确定按钮，只有翻页后当前页已选择用户被添加到自定义用户列表，之前页已选择用户未添加到自定义用户列表，添加丢失。问题解决需要：所有已选择用户（包括之前页选择的用户）均被添加到自定义用户列表。问题原因是：翻页之后表格重新加载，所以导致之前选择的数据丢失。问题优化：1、所有已选择用户（包括之前页选择的用...

vue 使用v-if实现tab切换，导致数据间互相影响的原因

不确定因素的博客

11-05

993

<div class="tagmsg" v-for="(item,index) in queueList" :key='index'></div> //循环时，v-for的key值取index导致点击转换时数据发生影响

vue-element-admin 三四级路由菜单无法缓存数据丢失问题最简单的解决办法

calvinly的博客

08-25

4184

vue-element-admin 开源框架，支持缓存的只能是一、二级路由页面，三级网上就无法缓存了；看了很多大佬的解决办法文章，尝试了很多，都无法解决办法，折腾了很久，快要放弃的时候，想到一个笨办法，但是却很简单、很有效！！！方法核心要点 1、将原本的三级路由页面定义在一级或二级路由位置上； 2、将上述目标路由页面设置为隐藏； 3、在三级路由上定义一个页面，点击后，关闭当前页面，并跳转至目标页面（即1定义的页面）；贴一下已经实现的代码，仅供参考路由文件代码： import Layout fr

一个基于vue-element-admin的模板细解

最新发布

qq_60279396的博客

01-30

444

view是：就是app-main中的子路由的展示：一般都是index中展示主要的，然后弹窗页面啥的，特殊的有将弹窗形式改为全替换动画，，每个都有一个空的路由页面，就是父的展示，要点击子路由才会进行展示。auth.js：包括了cookie和localStorage等的操作，能够对用户的信息，侧边栏的状态，token、和权限树的进行的存储和删除。getter.js是拿到当前store中的所有的信息，包括，侧边栏的打开关闭信息。app.js:对应了侧壁那栏中的子路由和父路由的展示情况的js。

vue-admin-template-master_vue-admin-master_

10-01

Vue Admin Template Master 是一个完整的后台管理系统的基础模板，它集成了Vue.js的核心特性，如组件化、虚拟DOM、响应式数据绑定等，并且通常包括路由管理（vue-router）、状态管理（Vuex）、API调用处理、权限控制...

Vue和Vue-Element-Admin（九）：el-table（多列排序），el-form，echarts组件化

叶子叶来

05-01

1116

目录 el-table表组件化 el-form组件化 echarts组件化 component即元素，组件，components中封装通用组件定义props传入数组，在views中父子关系引用，根据需要设置特殊样式。 el-table表组件化最简单写法： <template> <el-table :data="tableData" border style="width: 100%"> <el-table-column v-for=".

vue-element-admin刷新侧边栏数据丢失

Stitch_xiao的博客

06-02

1088

解决vue-element-admin刷新侧边栏丢失

解决vuex在页面刷新后数据丢失的问题

weixin_34357267的博客

05-22

285

一、原因　　js代码是运行在内存中的，代码运行时的所有变量、函数也都是保存在内存中的。　　刷新页面，以前申请的内存被释放，重新加载脚本代码，变量重新赋值，所以这些数据要想存储就必须存储在外部，例如：Local Storage、Session Storage、Index DB等。这些都是浏览器提供的API，让你可以将数据存储在硬盘上，做持久化存储。具体选择哪一个就根据你实际需求来选择。二、解决...

【前端学习】Vue数据丢失

Dog Sun的博客

03-15

1753

vue中数据模型中的属性数据都设置了特性，当属性数据改变的时候，页面会自动更新。如果我们修改了模型中的数据，视图没有更新，我们就说这部分修改的数据丢失了，这是Vue框架的bug。原因：丢失的数据是因为没有设置特性在vue中常见的数据丢失有四种 1.数组中的值类型数据改变当我们修改数组中值类型数据，数据会丢失解决：用新数组替换原来的数组 2.数组中添加新成员当我们为数组添加新成员的时候，数...

筛选时切换分页导致数据丢失

wangyangzxc123的博客

05-25

595

具体情况如下 search (pageNum = 1) { this.pageNum = pageNum // 默认为分页1 let obj = { page: { pageNum: this.pageNum, pageSize: this.pageSize } } Object.assign(obj.params, this.params) // 合并筛选里的数据 ... 发送请求参数为obj }.

element-plus的el-tabs切换后，刷新浏览器状态丢失

最是人间留不住，朱颜辞镜花辞树。

11-25

1918

原因：当浏览器刷新后，v-model绑定的数据也会重置，所以选中的状态会丢失。

vue-element-admin的管理系统，饿了吗框架。

09-15

综上所述，"vue-element-admin"是一个基于Vue.js和Element UI的全面后台管理系统，它利用了Vue.js的高效和Element UI的美观，结合Java后端的强大功能，为开发者提供了一个高效且易用的开发基础。无论是在企业内部...

vite-vue-elementplus-admin.rar

09-18

【标题】"vite-vue-elementplus-admin.rar"是一个基于Vue3、Vite2和ElementPlus构建的前端后台管理系统模板的压缩包。这个项目旨在为开发者提供一个快速启动的前端框架，用于构建高效的管理界面。【描述】描述中...

element ui NavMenu 导航菜单页面刷新时菜单选中状态丢失解决方法

weixin_45261457的博客

04-22

2960

element ui NavMenu 导航菜单一般做为后台管理系统的切换菜单，在选中菜单跳转页面时会有高亮提示用户选择的哪一个菜单，但是会出现的问题是在跳转页面之后用户如果刷新页面选中的高亮状态就会丢失，这时候只需要在官方给出的例子中做出一点小小的修改就可以实现。官方提供： <el-menu-item index="1-1">选项1</el-menu-item> 修改后...

vue-element-admin tagsView标签栏导航切换时页面刷新问题

weixin_45616483的博客

02-16

8594

项目使用vue-element-admin开发，在运行过程中发现，切换 tagsview标签栏导航时页面刷新了，没有保存下页面操作的内容，比如：查询框设置的内容，切换后没有了，需要重新设置查询条件，用户反映比较繁琐，要求要在切换标签栏导航时不重新刷新界面加载数据。上网查找发现，框架中默认会缓存tag页面，即noCache默认是false，如下图：但是，必须保证路由router中的name 和路由对应的vue 组件的name是一致的。而在我们的项目中，vue组件的名称缺省了，所以导致了两者匹配不上