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

相关推荐
我星期八休息1 天前
软件测试—从认识到BUG
考研·安全·bug
hulihutu442 天前
拒绝延期、bug、货不对板:2026 管理系统定制开发落地保障手册
github·bug·鸿蒙系统·数据库管理员
Rain5092 天前
谁动了我的 URL?——记一次微前端“灵异 Bug“的排查实录
前端·vue.js·人工智能·前端框架·bug·ai编程
百变梦仔2 天前
Codex 处理接口异常类 bug 时,我会让调试 Skill 先接住错误信息
bug
深念Y4 天前
fnOS-k3s-ResolvConf权限700-Bug分析
内核·bug·nas·k3s·fnos·魔改内核
不正经学生4 天前
C语言预处理详解:编译器真正动手之前的那些事
c语言·开发语言·算法·面试·bug
Capricorn19885 天前
Bug排障实录:Software 3.0 遭遇文献幻觉?知芽 Notebook Skill 底层架构解析
人工智能·笔记·架构·bug·论文笔记
项目管理与代码5 天前
Bug跟踪管理系统对比:从提报效率、流转体验与数据分析能力三个维度评估
bug·项目管理·bug跟踪
福大大架构师每日一题7 天前
RAGFlow v0.27.1 发布:新增 Azure DevOps、You.com 搜索,修复海量 Bug,性能大幅提升!
bug·azure·devops
树码小子7 天前
测试(6) - bug篇(上)
软件测试·bug