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

相关推荐
优雅的小武先生27 分钟前
QT中的按钮控件和comboBox控件和spinBox控件无法点击的bug
开发语言·qt·bug
酷酷-20 小时前
彩虹易支付最新版源码及安装教程(修复BUG+新增加订单投诉功能)
html·php·bug
佛系小嘟嘟1 天前
Android-由switch-case和view.getId()引起的bug:错误:需要常量表达式 的解决办法
android·bug
未来可期LJ1 天前
【测试-BUG篇】软件测试的BUG知识你了解多少呢?
软件测试·bug
软件测试很重要1 天前
追梦无Bug的软件世界
bug
我又来搬代码了2 天前
【Android】【bug】ImageView设置scaleType不生效的问题
android·bug
吴恩达亲传弟子2 天前
【Bug】解决 Ubuntu 中 “error: Unable to Find Python3 Executable” 错误
linux·ubuntu·bug
john_hjy3 天前
8. Bug 与 Error
javascript·bug
鸽芷咕4 天前
【Python报错已解决】 Encountered error while trying to install package.> lxml
开发语言·python·bug
鸽芷咕4 天前
【Python报错已解决】[notice] A new release of pip available: 22.2 -> 22.2.2
开发语言·python·bug·pip