具体要实现的细节
- 点击表头的复选项,会进行全选;再次点击,会取消;
- 每次需要把选中该行的id传过去
- 切换分页的时候,需要有记忆功能:也就是翻页原本选中的不应该消失 。下方图片展示:(展示的是所有的选中的,切换分页的)
1.
<el-table
:data="tableData"
ref="multipleTable"
:row-key="(row)=>{ return row.id}" //这行是重点
tooltip-effect="dark"
@selection-change="handleSelectionChange"
v-loading="listLoading"
border style="width: 100%"
@cell-dblclick="celldblclick">
</el-table>
2.
<el-table-column type="selection" :reserve-selection="true"></el-table-column>
3.
:row-key="(row)=>{ return row.id}"
:reserve-selection="true"
这两行是重点 加上功能就能实现,id一定要保证是有唯一性的
4.
val就是选中的数据
handleSelectionChange(val) {
console.log(val);
},