pro-components icon indicating copy to clipboard operation
pro-components copied to clipboard

🐛[BUG]ProList开启可选择的时候,且list主键是数字的时候item无选中的样式

Open zouyi741599086 opened this issue 3 months ago • 1 comments

🐛 bug 描述

ProList开启可选择的时候,且list主键是数字的时候item无选中的样式,当主键是字符串的时候item就正常了

📷 复现步骤

https://codesandbox.io/p/devbox/relaxed-joji-d8ykgw?file=%2Findex.html&workspaceId=ws_8tAGySNNDbXkzLU2L2eC95

🏞 期望结果

不管主键是数字还是字符串类型,item都能正常的显示 选中的样式

💻 复现代码

https://codesandbox.io/p/devbox/relaxed-joji-d8ykgw?file=%2Findex.html&workspaceId=ws_8tAGySNNDbXkzLU2L2eC95

© 版本信息

"dependencies": { "@ant-design/pro-components": "2.7.16", "antd": "5.20.0", "react": "18.3.1", "react-dom": "18.3.1" },

🚑 其他信息

zouyi741599086 avatar Sep 03 '25 03:09 zouyi741599086

Hi @zouyi741599086! I'm Dosu and I’m helping the pro-components team.

这个问题的根本原因是 ProList 的选中样式依赖于 key 的类型完全一致。内部选中逻辑会用 Set.has(key) 来判断选中状态,如果你的数据 key 是数字,但选中的 key 是字符串(或反之),就不会显示选中样式。代码没有做类型转换或归一化,严格区分 string 和 number 类型,所以会出现你描述的现象 相关讨论

目前没有看到新版本修复这个问题,官方和维护者建议:所有 key 类型保持一致,推荐都用字符串类型,这样选中样式就能正常显示 源码分析

简单做法:在数据和 rowKey 处理时,把数字 key 转成字符串,比如 rowKey={row => String(row.id)} 或数据源里直接用字符串 id。

这样就能解决选中样式不显示的问题。

To reply, just mention @dosu.


How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other  Chat with Dosu Join Discord Share on X

dosubot[bot] avatar Sep 03 '25 03:09 dosubot[bot]