antd vue的table换页以后选中的数据无法记住前一页已勾选的数据

最近在开发中发现antd vue的table组件换页以后选中的数据无法记住前一页已勾选的数据
只能记住selectedRowKeys, 但是换页以后selectionRows只有当前页的数据, 现在我需要也有之前勾选的rows数据(即整条数据信息)

<a-table
  	:columns="columns"
    :dataSource="dataSource"
    bordered
    :pagination="pagination"
    :rowSelection="{ onSelect: onSelect, onSelectAll: onSelectAll, selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
    @change="handleTableChange">
 </a-table>

使用组件自带的onSelect事件和onSelectAll事件来记录

onSelect(record, selected) {
 selected
    ? this.selectionRowsPlus.push(record)
    : this.selectionRowsPlus.splice(
        this.selectionRowsPlus.findIndex(x => x.id === record.id),
        1
      )
},
onSelectAll(selected, selectedRows, changeRows) {
  this.selectionRowsPlus = selected
    ? this.selectionRowsPlus.concat(changeRows)
    : this.selectionRowsPlus.filter(x => !changeRows.find(i => i.id === x.id))
},
// 选中
onSelectChange(selectedRowKeys) {
  this.$nextTick(() => {
    this.selectedRowKeys = selectedRowKeys
  })
},

这样无论是否切换页面 selectionRowsPlus 里面就是我们所有勾选的数据

  • 2
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值