AntDesign table 分页多选问题（接口支持分页，模糊查询）

1.可以直接使用antd中的onChange的Function(selectedRowKeys, selectedRows)

注意Table的rowKey取值，一定要唯一，否则会有意外惊喜，比如会选中下一页的同行数据

2.接口支持分页及模糊查询，支持多次选择

话不多说，直接上代码

onSelectionChange = (selectedRowKeys, selectRows) => {
        let {dataSource, selectedRows} = this.state
        console.log("selectedRowKeys", selectedRowKeys)
        console.log("selectedRows", selectRows)
        let allSelectedRows = selectedRows.slice(0)

        // 步骤1
        dataSource.forEach(item => {
            if(selectedRowKeys.indexOf(item.id) >= 0 ) {
                allSelectedRows.push(item)
            }
        })

        //步骤2 因为是分页了，如果已经删除了某个选中的，这里需要过滤掉
        allSelectedRows = allSelectedRows.filter(item => selectedRowKeys.indexOf(item.id) >= 0)

        //步骤3 过滤步骤1添加的重复数据，即自身的重复数据
        let returnList = []
        allSelectedRows.forEach(item => {
           if(returnList.filter(returnItem => returnItem.id === item.id ).length === 0 ){
                returnList.push(item)
           }
        });

        this.setState({selectedRowKeys , selectedRows: returnList })
    }

有疑问的小伙伴可以将 console.log("selectedRowKeys", selectedRowKeys); console.log("selectedRows", selectRows) 在控制台打出，看一下

selectRows 是当前页面选中的数据；

selectedRowKeys 是所有选中的rowKey

如果有其他更好的方法，欢迎大家留言哦~