element-ui 表格翻页多选,数据回显
reserve-selection与row-key结合


<el-table :data="pageData" ref="goodsTable" size="small" v-loading="loading" height="520" @selection-change="handleSelectionChange" :row-key="getRowKeys">
<el-table-column type="selection" :reserve-selection="true" width="50" prop="id">
</el-table-column>
<el-table-column label="编号" prop="goodsCode" width="130">
</el-table-column>
<el-table-column label="品名" prop="tradeName" show-overflow-tooltip>
</el-table-column>
<el-table-column label="规格" prop="specification" width="150" show-overflow-tooltip>
</el-table-column>
<el-table-column label="最小包装" prop="minPack" width="150" show-overflow-tooltip>
</el-table-column>
<el-table-column label="状态" prop="saleState" width="100">
<template scope="scope">
<el-tag>{{scope.row.saleState | statusFilter}}</el-tag>
</template>
</el-table-column>
<el-table-column label="生产厂家" prop="manufacturer" show-overflow-tooltip>
</el-table-column>
</el-table>
data() {
pageData: [],
loading: false,
// 获取row的key值
getRowKeys(row) {
return row.id;
},
selectedData: []
},
推荐网址:https://segmentfault.com/q/1010000009772656
http://element.eleme.io/#/zh-CN/component/table#table-column-attributes
element-ui 表格翻页多选,数据回显的更多相关文章
- element ui 表格提交时获取所有选中的checkbox的数据
<el-table ref="multipleTable" :data="appList" @selection-change="changeF ...
- 封装一个优雅的element ui表格组件
现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开.虽然element ui的table组件很好.但是表格和分页是分离的.每次写表 ...
- 关于【vue + element-ui Table的数据多选,多页选择数据回显,分页记录保存选中的数据】的优化
之前写的[vue + element-ui Table的数据多选,多页选择数据回显,分页记录保存选中的数据]这篇博客.功能虽然实现了相对应的功能.但是用起来很不爽.所以进行了优化. 备注:最近可能没时 ...
- element ui 渲染超过上百条数据时页面卡顿,更流畅的加载大量数据
问题:element ui table渲染上百条数据,页面渲染开始出现延时 解决方案:使用pl-table 注意:设置use-virtual并给定table高度
- Struts2【UI标签、数据回显、资源国际化】
Struts2UI标签 Sturts2为了简化我们的开发,也为我们提供了UI标签...也就是显示页面的标签..... 但是呢,Struts2是服务端的框架,因此使用页面的标签是需要在服务器端解析然后再 ...
- Struts2第十一篇【简单UI标签、数据回显】
Struts2UI标签 Sturts2为了简化我们的开发,也为我们提供了UI标签-也就是显示页面的标签-.. 但是呢,Struts2是服务端的框架,因此使用页面的标签是需要在服务器端解析然后再被浏览器 ...
- 一脸懵逼学习Struts数据校验以及数据回显,模型驱动,防止表单重复提交的应用。
1:Struts2表单数据校验: (1)前台校验,也称之为客户端校验,主要是通过Javascript编程的方式进行数据的验证. (2)后台校验,也称之为服务器校验,这里指的是使用Struts2通过xm ...
- 二十 Struts2的标签库,数据回显(基于值栈)
通用标签库 判断标签:<s:if>.<s:elseif>.<s:else> 循环标签:<s:iterator> 其他常用标签: <s:proper ...
- SpringMVC(三) —— 参数绑定和数据回显
参数绑定的过程:就是页面向后台传递参数,后台接受的一个过程. 默认支持的参数类型:(就是你在方法上以形参的形式去定义一下的类型,就可以直接使用它) HttpServletRequest HttpSer ...
随机推荐
- Python dict 将元祖转成字典
dict 关键字 dict3=dict(((),(),())) #dict 只有一个参数 输出:{'a': 97, 'b': 98, 'c': 99}
- 如何创建R包并将其发布在 CRAN / GitHub 上--转载
转载--https://www.analyticsvidhya.com/blog/2017/03/create-packages-r-cran-github/ 什么是 R 包?我开始创建 R 包的原因 ...
- PostMan做接口自动化测试
try{ var jsonData = pm.response.json(); } catch (e) { console.log("No body"); } pm.environ ...
- Xshell5中常用linux服务器命令集合
简易版:http://www.zhimengzhe.com/linux/84546.html 详细版:http://www.cnblogs.com/peida/tag/%E6%AF%8F%E6%97% ...
- 基于Arcface Android平台的人脸识别实现
效果图 先上效果,让大家看看如何 现在有很多人脸识别的技术我们可以拿来使用:但是个人认为还是离线端的SDK比较实用:所以个人一直在搜集人脸识别的SDK:原来使用开源的OpenCV:最近有个好友推荐虹软 ...
- 约瑟夫环(Joseph)的高级版(面向事件及“伪链表””)
约瑟夫环问题: 在一间房间总共有n个人(下标0-n-1),只能有最后一个人活命. 按照如下规则去杀人: 所有人围成一圈 顺时针报数,每次报到q的人将被杀掉 被杀掉的人将从房间内被移走 然后从被杀掉的下 ...
- js获取时间戳(new date()参数获取)
当获取截止到某一个时间点的时间戳时: 例如:到 2018-03-15 11:03:55 这个时间点的时间戳的时候 正确的写法: var data = new Date("2018/03/15 ...
- 设计一个带有getmin功能的栈,保证时间复杂度在O(1)
2017-06-22 20:56:10 需要得到最小值,最简单的思路就是遍历一遍求出最小值.但是这样的时间复杂度会是O(n),不满足O(1)的要求.于是想到在建立一个栈来保存最小值. 具体操作是建立 ...
- 日常英语---十一、MapleStory/Monsters/Level 201-210(Dark Demon Eagle Rider)
日常英语---十一.MapleStory/Monsters/Level 201-210(Dark Demon Eagle Rider) 一.总结 一句话总结:骑着鹰的快速飞行的恶魔,进入地图后跟着你. ...
- Go语言学习之1 基本概念、环境搭建、第一个Go程序
一.环境搭建 见我的这篇博客 https://www.cnblogs.com/xuejiale/p/10258244.html 二.golang语言特性1. 垃圾回收 1) 内存自动回收,再也不 ...