涉及组件属性有以下:
- row-key(el-table中的属性) 行数据的 Key,用来优化 Table 的渲染;在使用 reserve-selection 功能与显示树形数据时,该属性是必填;传入一个Function;
以上写法表示以当前行数据中的userId为唯一键,对table进行渲染优化 - reserve-selection(el-table-column中的属性) 仅对 type=selection 的列有效,类型为
Boolean;为 true 则会在数据更新之后保留之前选中的数据;(需指定 row-key)
涉及组件事件有以下:
selection-change(el-table中的事件)
当选择变化时触发,可以获取到所有页面勾选的行数据
通过以上属性和事件就可以实现table列表的翻页多选功能
功能补充—解决修改时el-table反选功能的实现
解决思路:
- 在created中先获取需要反选的列表,这里假设是selList
- 获取到需selList后再去获取列表数据,这里假设是tableList
- 先为tableList做渲染,然后再遍历tableList中的每一项,并查找出要反选的selList中对应的项。然后调用toggleRowSelection修改对应行状态为选中,然后删除selList中使用过的项
- 提交的时候需要将selection-change事件中所有选中项于selList中的剩余项合并,然后提交