问题:在可选择Table中使用查询功能时,再添加选中项时原选中项会置空
方法一:修改onChange方法,只能完成数据选中,不能完成取消选中(失败)
方法二:修改onSelect方法,可以完成选中和取消选中,但选中效果需要通过再Table组件上加上来刺激渲染,这样会导致选中时闪烁(不友好)
onSelect: (record: any, selected: any, selectedRows: any) => {
let data = selectedRowKeys
if (selectedRowKeys.find(it => it === record.fdId) === undefined) {
data.push(record.fdId)
} else {
data = selectedRowKeys.filter(it => it !== record.fdId)
}
setSelectColumns(selectedRows)
setSelectedRowKeys(data);
},
onSelectAll: (selected: boolean, selectedRows: any) => {
let keys = []
if (selectedRowKeys.length < fieldData.length) {
keys = fieldData.map(item => item.fdId)
}
setSelectColumns(selectedRows)
setSelectedRowKeys(keys)
}
方法三:在rawSelection中添加属性:
preserveSelectedRowKeys=true
官网的说明是当数据被删除时仍然保留选项的 (看到这句话时完全没想过要用它来解决),其实在这里是当table查询操作重新渲染时保留选项的key(完美解决)