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,否则在进行选择、或者实现默认选择时会出现离奇现象,总是到不到想要的效果

相关推荐
1nv1s1ble17 小时前
记录rust滥用lazy_static导致的一个bug
算法·rust·bug
银色的白2 天前
开发记录:修复一些Bug,并实现两个功能
bug
吃货界的硬件攻城狮3 天前
【BUG】记STM32F030多通道ADC DMA读取乱序问题
stm32·嵌入式硬件·bug
星释3 天前
Yii2项目自动向GitLab上报Bug
前端·gitlab·bug·yii
upp4 天前
【bug】Error: /undefinedfilename in (/tmp/ocrmypdf.io.9xfn1e3b/origin.pdf)
ubuntu·pdf·bug·ghostscript
杨过姑父4 天前
部署开源版禅道,修改apache端口无效解决
bug·apache·软件工程·issue
chao_7895 天前
针对“仅某个地区出现Bug”的原因分析与解决方案
测试用例·bug
帅帅哥的兜兜5 天前
Bug问题
bug
养意5 天前
git提交代码和解决冲突修复bug
git·bug
东方不败之鸭梨的测试笔记6 天前
20250605车充安服务器受木马攻击导致服务不可用
bug