elementui分页记录,reserve-selection

elementui分页记录,reserve-selection

作用:实现多选框选择后,点击下一页可以记录多选框状态。

第一步:
在<el-table></el-table>标签中加上 :row-key="getRowKeys"

第二步:
在<el-table-column type="selection"></el-table-column>此行加上:reserve-selection="true"

第三步:
在 data() {
return {
multipleSelection:[],//复选框
getRowKeys(row) {//记录每行的key值
return row.id;//id 自己查看 row 里的数据 
},
select_order_number:'',//表格select选中的条数
select_orderId:[],//表格select复选框选中的id

}
}

第四步:
handleSelectionChange(rows) {//复选框
this.multipleSelection = rows;
this.select_order_number = this.multipleSelection.length;

this.select_orderId = [];
if (rows) {
rows.forEach(row => {
if (row) {
this.select_orderId.push(row.id);
}
});
}
}

第五步:
在<el-table></el-table>标签中加上 @selection-change="handleSelectionChange" 事件

 

效果图:

 

  • 7
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值