VUE+elementUI 分页请求回显问题解决方案
一直专注写后台的本人,之前新产品回显问题,一直没处理,这对实施配置系统,会产生很大影响 由于写页面的同事要离职,一直在游泳,只能自己上手去干了。本人对 vue 和elementUI 处于一知半解,所以一开始是上百度 看下有没有现成的,但我发现 查到的资料 都只告诉你 添加的时候 操作分页的时候 能保存你之前页数打钩的数据,保存后,的确把我们所打钩上的数据保存下来了,然后点击编辑,网上的逻辑是让我们 循环进行判断是否存在进行打钩,但如果再进行保存,只会保存你当前页打钩的数据或者去掉的数据,其他数据就进行丢失了,当然我们可以创建几个变量进行保存,然后判断,代码量太多了,作为一个合格的摸鱼选手,这是不允许的,能简单就坚决不复杂。我处理的方式如下:
1.跟网上一样 先填充以上参数:
这个 :row-key 就很重要了 这个用法应该element内部用来判断是否打钩并动态生成数据的,本人这边的主键是xx编码
后面就是重头戏了:如何实现修改 回显打钩,又可以动态保存你当前页操作过的数据(去掉或者新增的数据,之前的数据又可以动态进行新增或者删除) 本人写法是,通过父组件调用后台数据传给子组件 然后把上次保存的数据进行如下操作
这样 第一次进来的时候 把你之前所有的数据 放进elementUI 进行保存
然后当你 当前页进行新增 或者删除的选项的时候,element框架 会在内部判断 数据动态进行删除或者新增 给予新的val
VUE+elementUI 分页请求回显问题解决方案的更多相关文章
- Vue ElementUI Tree组件 回显问题(设置选择父级时会全选所有的子级,有此业务场景是不适合的)
业务场景下有这样的问题 业务需求需要保存前端 半选节点 解决方案 let checked = this.$refs.menuTree.getCheckedKeys(); //此方法获取半选节点 let ...
- vue+ElementUI 分页
现在写的Vue+ElementUI是自己写的是文档上的死数据,所以在分页上自己分割了一下,如果有接口话,会方便一点,使用的是分页的完整功能.都差不多啦! 撸起来 <template> &l ...
- vue Element-UI 分页使用(1)
最近在使用Element-UI这套框架配合Vue来写前端页面.在用Element-UI来制作表格的时候,遇到了一些小问题,记录方便学习. 其中两个事件是关于切换当前页和切换显示的列表条数的.另外的属性 ...
- vue element-ui 分页组件封装
<template> <el-pagination @size-change="handleSizeChange" @current-change="h ...
- Element-ui表格选中回显
先瞄一下,是不是你要的效果 然后,废话不多说,直接上代码啦 <template> <div class> <div class="projectData&quo ...
- vue element upload图片 回显问题
beforeUpload (file) { var _this = this; var reader = new FileReader(); reader.readAsDataURL(file); ...
- 关于【vue + element-ui Table的数据多选,多页选择数据回显,分页记录保存选中的数据】的优化
之前写的[vue + element-ui Table的数据多选,多页选择数据回显,分页记录保存选中的数据]这篇博客.功能虽然实现了相对应的功能.但是用起来很不爽.所以进行了优化. 备注:最近可能没时 ...
- vue + element-ui Table的数据多选,多页选择数据回显,分页记录保存选中的数据。
业务的需要:我要对与会人员勾选,记录所选的与会人员,并且点击到别的页面上时也要记录所勾选的.第一次尝试,每次点击下一页数据都会清空.然后我就去element ui官网查看了api.实现如下: 在tab ...
- Vue -- element-ui el-table 点击tr项页面跳转,返回后缓存回显点击项
页面跳转反显(点击项,点击table滚动的位置,搜索条件,分页回显) 点击table tr项后,页面跳转到下级页面,返回回显搜索条件.当前页码.并将点击项select选中.滚动条也被记录回显跳转时滚动 ...
- vue 运用ElementUI,做select下拉框回显
第一.加载的顺序,应该先加载下拉框要选择的数据,然后在通过编辑查询数据后回显. 第二.要保证select下拉的ID和v-model里边的id保持一致. 第三.elementUI就会自动的将数据回显了. ...
随机推荐
- FastAPI中声明参数为必需的三种方式
前提 有时候我们定义一些参数的时候,需要声明这个参数为必需,请求者必须传递该参数.FatstAPI中声明参数为必需的方式有三种,分别为:不设默认值. "..." 和 " ...
- 2022-05-27内部群每日三题-清辉PMP
1.一个组织正在开始一个大型的.首个这种类型的项目.项目经理与相关方召开会议,以识别存在的项目问题.项目经理应该使用什么工具和技术来改进会议的结果? A.头脑风暴.核对单和访谈 B.头脑风暴.因果图和 ...
- ssm框架下的拦截器过滤静态资源以及拦截jsp
这篇文章如果能给你带来帮助 不胜荣幸,如果有错误 ,欢迎批评指正,共同进步. 今天啊搭了一个ssm的框架 虽然说现在大部分都在使用shiro权限,可是正如mybatis.hibernate和jdbc的 ...
- RxJava2.x的理解与总结
RxJava2.x的理解与总结 RxJava是一个基于观察者设计模式将链式编程和异步结合在一起的开源库. 链式编程 通过查看GitHub开源项目的简介开源知道,RxJava有几个基类. 他们分别适用于 ...
- PLC数据块中的偏移量
PLC数据块中的偏移量是什么? 偏移量定义为:把存储单元的实际地址与其所在段的段地址之间的距离称为段内偏移,也称为"有效地址或偏移量". 段地址左移四位,与有效地址相加,就构成了逻 ...
- 【c#】csharp_learn
csharp learn JSON C#解析JSON字符串总结 https://www.cnblogs.com/nc923/p/11418583.html c#解析json字符串处理(最清晰易懂的方法 ...
- java 自定义注解与示例
自定义注解 @Target(value = {ElementType.METHOD})// 使用范围:方法 @Retention(RetentionPolicy.RUNTIME)// 作用域:运行时有 ...
- svn ssh方式避免每次输入密码
ubuntu下没有tortoiseSVN,用svn+ssh方式每次都提示要输入密码 通过配置~/.ssh/config文件让系统记住ssh密匙(private key)文件就不用输入密码了. 在con ...
- C#连Mysql数据库报错 SSL Connection error
MySql.Data.MySqlClient.MySqlException (0x80004005): SSL Connection error. ---> System.AggregateEx ...
- vue3 门户网站搭建5-图标
奈何 element 自带的图标太少,不够用,故打算使用 vite-plugin-svg-icons 组件来封装 svg-icon . ps: ui 框架选用的 element-ui,为了能跟 vue ...