fix: 修复纵向滚动表格切换数据时表头宽度跳动

[biubiukam]

🤔 这个变动的性质是？

• 新特性提交
• Bug 修复
• 站点、文档改进
• 演示代码改进
• 组件样式/交互改进
• TypeScript 定义更新
• Bundle 尺寸优化
• 性能优化
• 功能增强
• 国际化改进
• 重构
• 代码风格优化
• 测试用例
• 分支合并
• 工作流程
• 其他改动（是关于什么的改动？）

🔗 相关 Issue

• Fixes Table 设置scroll.y，在空数据下场景下，因scrollbar占位th导致列宽跳动 ant-design/ant-design#56713
• Fixes Table数据为空时，thead和summary会错位 ant-design/ant-design#57916
• Related to fix: table header broken when scroll do not have the data(#594) #595

💡 需求背景和解决方案

当 Table 配置 scroll.y 后，表头和表体会被拆分成两个独立的 table。

在空数据状态下，表头仍然包含业务列和 scrollbar 占位列，但原有逻辑会回退使用只包含业务列的 Body ColGroup，导致 N+1 个表头单元格对应 N 个 <col>。数据变为非空并完成列宽测量后，表头又会切换为包含 scrollbar 占位列的 N+1 列模型，浏览器因此重新分配业务列宽，产生宽度跳动。

此外，空数据状态使用 overflow-y: auto，非空状态使用 overflow-y: scroll。如果空数据测量时没有预留实际滚动条宽度，两种状态下可用于业务列的宽度也会不同。

本次修改：

• 将业务列宽来源与 scrollbar 占位列是否存在拆分处理。
• 存在完整测量宽度时继续使用测量结果，包括数据从非空切换为空的场景。
• 尚未取得完整测量宽度时，继续回退使用 columns 声明的宽度，保留 fix: table header broken when scroll do not have the data(#594) #595 的历史行为。
• 仅当实际 scrollbarSize 大于 0 时添加 scrollbar <col> 和表头占位单元格。
• 空数据且仅配置纵向滚动时，使用实际 scrollbarSize 预留测量空间，不硬编码滚动条宽度。
• 保证固定 Header 和固定 Summary 使用一致的 ColGroup 列模型。
• 增加空数据初始化、空与非空双向切换、部分声明列宽、内部列属性、零宽滚动条、固定 Summary 以及 fix: table header broken when scroll do not have the data(#594) #595 历史场景的回归测试。

验证结果：

• npm test：21 个测试文件、224 个测试全部通过。
• npm run tsc：通过。
• npm run lint：0 errors。
• npm run build：通过。
• 真实 Chromium 中，空数据、非空数据及再次清空后的业务表头宽度均为 [120, 424, 160]，双向切换差值均为 0px。
• 有滚动条时始终包含 4 个叶子 <th> 和 4 个 <col>，最后一个 <col> 使用浏览器实际测得的 15px scrollbarSize。

📝 更新日志

语言	更新描述
🇺🇸 English	Fix Table header width jumping when data changes between empty and non-empty with vertical scrolling.
🇨🇳 Chinese	修复 Table 开启纵向滚动时，数据在空与非空之间切换导致表头宽度跳动的问题。

Summary by CodeRabbit

• Bug Fixes
  • 优化固定表头、固定汇总与主体表格的列宽同步，减少滚动条出现时的错位。
  • 改善空数据场景下的表格宽度计算，确保表头与内容区域保持一致。
  • 修复数据为空与恢复数据后列宽变化不稳定的问题。
  • 优化未设置列宽时的表格布局，并提升滚动条占位列的显示一致性。

[gemini-code-assist]

Caution

The consumer version of Gemini Code Assist on GitHub has been sunset. All code review activity has officially ceased.

[vercel]

@biubiukam is attempting to deploy a commit to the afc163's projects Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Walkthrough

Changes

滚动条列宽与空数据布局

Layer / File(s)	Summary
FixedHolder 列宽模型 src/FixedHolder/index.tsx	移除 noData 与 colGroup 入参，基于滚动条列和测量结果计算表头列集合、列宽及容器宽度，并统一渲染 ColGroup。
Table 空数据布局接入 src/Table.tsx	固定表头且无数据时追加滚动条宽度修正，并移除 FixedHolder 的旧属性传递。
滚动条列模型测试 tests/FixedHeader.spec.jsx	覆盖空数据切换、滚动条尺寸、固定汇总复用及未声明列宽等场景。

Estimated code review effort: 3 (Moderate) | ~20 minutes

Possibly related PRs

• react-component/table#1261：同样调整 FixedHolder 的公开属性处理。
• react-component/table#1267：同样涉及表格列宽与滚动条尺寸测量流程。
• react-component/table#1336：同样修改 FixedHolder 的滚动条列与 ColGroup 渲染逻辑。

Suggested reviewers: zombiej

Poem

小兔挥耳朵，滚动条列站稳，
空表有宽度，满表不乱跑。
ColGroup 排成行，
表头与汇总相望。
轻轻一跳，列宽稳稳发光。

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Linked Issues check	✅ Passed	变更实现了空数据时保留业务列并明确滚动条占位列宽度，满足 #56713 的目标。
Out of Scope Changes check	✅ Passed	改动集中在 FixedHolder、Table 和回归测试上，未见明显与问题无关的变更。
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	标题准确概括了修复纵向滚动表格在切换数据时表头宽度跳动这一主要改动。

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}