element-ui 中 el-table 分页多选(记住上一页勾选数据)及编辑回显
element-ui 中 el-table 分页多选(记住上一页勾选数据)及编辑回显
element-ui 的官网是有属性的
el-table-colum 的 reserve-selection 属性
el-table 的 row-key 属性
row-key 属性传入唯一值
<el-table:data="tableData"borderstripev-loading="tableloading"ref="multipleTable"row-key="equipmentId"@selection-change="handleSelectionChange"
><el-table-column type="selection" label="序号" reserve-selection width="50"></el-table-column>
</el-table>
row-key 属性传入一个方法
<el-table:data="tableData"borderstripev-loading="tableloading"ref="multipleTable":row-key="getRowKeys"@selection-change="handleSelectionChange"
><el-table-column type="selection" label="序号" reserve-selection width="50"></el-table-column>
</el-table>
getRowKeys(row) {return row.equipmentId
},
编辑回显数据
核心:this.$refs.multipleTable.toggleRowSelection(val, true)
// 数据列表
dataTable() {let vm = this;let url = vm.common.data().wisdomCommunityWeb + "/upgrade/plan/equipment-page-list";let data = {};data = { ...vm.dataForm, ...vm.pages };vm.tableloading = truevm.common.getdata(vm, url, data, function (res) {vm.tableloading = false;vm.tableData = res.data;vm.pages.num = res.total;vm.tableData.forEach((item) => {if(item.isCheck == 2) {vm.$refs.multipleTable.toggleRowSelection(item)}});});
},
element-ui 中 el-table 分页多选(记住上一页勾选数据)及编辑回显相关推荐
- laravel5.5中添加对分页样式的修改上一页和下一页
博客原文地址http://www.xiegaosheng.com/post/view?id=93; laravel自带的分页样式有点丑,laravel支持自定义样式的, 想把上一页和下一页显示成汉字而 ...
- Element UI中el-calendar日历的年月快捷选择(可下拉选框选择)
需求: 以日历形式展现当前页面.其中,年月可进行下拉选择,默认选中当月,用户可以自由点选日期 实现思路:右上角年月元素隐藏掉,写一个下拉选框,通过css定位到正确位置,通过vue计算属性进行数据绑定 ...
- 关于Element UI中页面样式小问题
一,修改组件dialog窗口的大小 二,在我使用upload组件上传一张美女图片时,发现当预览图片时,图片是灰色的,点击一下才会变亮,这种效果使我很不舒服,于是我通过添加下面的一条样式,问题解决了(可 ...
- 《前端》Element ui 表格(Table)组件中前端实现数据分页和模糊查询--未看
我是用的Element ui 表格(Table)组件中的例子 下面是别人自己写的方法: Element ui 表格(Table)组件中前端实现数据分页和模糊查询_明天也要努力的博客-CSDN博客 h ...
- Web前端笔记-element ui中table中某列添加a便签进行跳转
效果是这样的: 这里的文章标题和查看都可以进行跳转. 其中对应的代码如下: <template style="height: 100%"><el-table:da ...
- web前端-Vue element UI中的el-table勾选框 展示隐藏;设置默认勾选、禁用
1.el-table如果我们想新增一个勾选框,在 .vue文件中 <el-table-column type="selection" width="55" ...
- Web前端笔记-修改element ui中表格样式(透明、去横纵线等含修改思路)
官方效果是这样的: 此处改成了这样的效果: 此处是可以进行滑动的,就是去除了滑动条,仍能滑动的效果. 下面说下修改样式,找到使用el-table的vue组建: 在style中贴上: <style ...
- 关于Element UI中select组件中遇到的问题
问题一:在使用select组件设置多选功能后,窗口抖动问题? 详细描述:在我使用select做多选的功能时出现了窗口抖动的问题,测试的时候发现,在有些人的电脑上抖动,有些人的电脑上不抖,找了很多文档, ...
- element ui中的el-dropdown(下拉框)防止点一下就隐藏的问题
element ui中的el-dropdown(下拉框)防止点一下就影藏的问题 当使用el-dropdown下拉框时,下拉框的每项中,可能需要加入@click.@change或复选框等事件,而el-d ...
最新文章
- perl语言入门第七版中文_网站编程语言的选择
- 数据库的几个概念:主键,外键,索引,唯一索引
- 【百度地图API】如何判断点击的是地图还是覆盖物?
- obs之libx264编码
- JavaBean递归拷贝工具类Dozer
- 软件产品功能思维导图
- LaTex的安装和使用
- 手机APP数据包抓包分析
- 第一次在CSDN上写博客
- 纪念非线性光学诞生:Peter Franken和非线性光学
- 百度地图只显示行政区划轮廓
- MATLAB 棋类小游戏合集(围棋,六子棋,走四棋,九子棋,含禁手五子棋等等)
- java ssh超市进销存管理系统(源码+文档)【源码分享】
- 关于DS12C887 以外部RAM方式访问
- 芬斯狄娜内衣怎么样,文胸质量好不好吗
- 2022-2027年中国聚丁烯管市场竞争态势及行业投资前景预测报告
- 鱼雷导引仿真matlab
- 智能插座_如何重置您的ConnectSense智能插座
- linux下ipython的安装
- 数字电路基础知识系列(一)之LC滤波器基础知识
热门文章
- gitlab访问令牌使用_使用gitlab API
- remap函数的使用问题
- git 进阶教程 一
- 第六代微型计算机是,第六代酷睿处理器Skylake首发测试
- html 随机字母,JS简单生成由字母数字组合随机字符串示例
- JAVA 以UTF-8导出CSV文件时产生乱码的解决方法
- [08.03.14-15] 虐,并快乐着. 东西天目七尖穿越
- 马良建模学习笔记——软包制作十五
- spark(day06-spark算法、Spark Sql)
- js银行卡、身份证号处理用***代替