antd的Table组件使用rowSelection属性实现多选时遇到的bug

前言

前端样式框架采用AntDesign时,经常会使用到Table组件,如果要有实现多选或选择的需求时往往就会用到rowSelection属性,效果如下

rowSelection属性属性值如下

问题

文档中并没有说明选择时以数据中的哪个属性为准,看官方案例是默认以名为key的属性为准,那如果我们项目要展示的数据没有key,而想要以数据中的id为准,该如何设置?

解决方法

在Table组件中明确指出rowkey是什么,如下以react为例:

react 复制代码
<Table
              columns={comAnounceH}
              dataSource={commonNewsData}
              pagination={{
						 total: pageCount,
			              pageSize: 5
						}}
              rowSelection={{
					selectedRowKeys: this.state.selectedRowKeys,
                    onSelect: (record, selected, selectedRows, nativeEvent) => {
                      this.updateSelectData(selected, Array(1).fill(record))
                    },
                    onSelectAll: (selected, selectedRows, changeRows) => {
                      this.updateSelectData(selected, changeRows)
                    },
				}}
              rowKey= {record => record.id}
            />

关键代码rowKey= {record => record.id},指明rowKey为数据中的id,否则在进行选择、或者实现默认选择时会出现离奇现象,总是到不到想要的效果

相关推荐
猫咪很可爱14 小时前
MySQL 5.7 备份恢复后函数与存储过程丢失:原因分析与正确备份姿势
数据库·mysql·bug·shell
李永奉20 小时前
杰理可视化SDK开发-【BUG】AC7006F8芯片开启一拖二和双麦DNS通话算法后,大概率通话时蓝牙自动断连,RAM空间爆了问题处理
单片机·嵌入式硬件·mcu·物联网·电脑·bug
8年车载测试3 天前
车载测试中如何通过 Jira 平台提交 Bug:操作步骤与关键要点
bug·jira·uds诊断·hil测试·uds自动化测试·ecu刷写测试·canoe工具
硅基手札4 天前
SPI技术系列 13 · SPI 调试与排查
linux·运维·stm32·单片机·嵌入式硬件·bug
李永奉4 天前
杰理可视化SDK开发-【BUG】AC7006F8芯片开启一拖二和双麦通话语音算法后,设置触摸音在唤醒语音助手和通话时触摸音没作用问题
单片机·嵌入式硬件·mcu·物联网·电脑·bug
kyle~6 天前
机器人通信 --- FANUC TCP 并发请求-响应错位 Bug 复盘
tcp/ip·机器人·bug
鬼手点金8 天前
Harness 工程:模型之外的竞争力
服务器·人工智能·深度学习·机器学习·bug
巴巴媛6669 天前
【Debug1】程序死机,while(1)循环,怎么办?
c语言·笔记·stm32·嵌入式硬件·bug
JosieBook11 天前
【多线程】两台机器同时抢一个字典:一次并发 Bug 的排查
java·网络·bug
鬼手点金11 天前
nanoGPT/nanochat 能做出 DeepSeek/Qwen 这样的大模型吗?
服务器·前端·javascript·bug·openclaw