具体要实现的细节点击表头的复选项,会进行全选;再次点击,会取消;
每次需要把选中该行的id传过去
切换分页的时候,需要有记忆功能:也就是翻页原本选中的不应该消失 。下方图片展示:(展示的是所有的选中的,切换分页的)
第一步添加对应的复选框
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLicmbw5iY3UDZ2I2YjNzM0czNiVmNyIWNlZzYzUWZ1IDZyI2M18CX0JXZ252bj91Ztl2Lc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
具体参照element官网示例``
* 1`
`
* 1
* 2
* 3
* 4
* 5
* 6
* 7
* 8
* 9
第二步传id过去的话
这个是页面布局`// 点击多选
handleSelectionChange(val) {
this.multipleSelection = val;
this.batchPassArr = [] //每次点击需清空原本数组的内容
this.multipleSelection.map(item => { //遍历数组,把id存进自定义的数组里
this.batchPassArr.push(item.id)
})
this.batchPassArr = this.batchPassArr.join(',')
},`
* 1
* 2
* 3
* 4
* 5
* 6
* 7
* 8
* 9
* 10
* 11
* 12
* 13
* 14
* 15
* 16
* 17
第三步对于切换分页
在表头那里加个:row-key="(row)=>{ return row.id}"`也就是下面这个样子`
* 1``
* 1
在自己加的里面加个`:reserve-selection="true"`
* 1
也就是下面这个``
* 1