ant-design Table组件错位/对不齐

最新推荐文章于 2025-05-23 18:29:57 发布

原创

最新推荐文章于 2025-05-23 18:29:57 发布 · 4.2w 阅读

CC 4.0 BY-SA版权

文章标签：

此篇乃小伙伴们在花式踩坑antdesign的Table组件后，总结的专治对不齐的十全大补丸，望君趁早服用及时康复，如果你还踩出了更多花样对不齐，欢迎臭jio的你前来补充?。

一：问题概览

序号	异常表现	产生原因	解决方案
1	1.纵向/列对不齐	1.1.有列(column)没有设置宽度	为所有column设置width
2		1.2.语句/单词过长	打破语句与单词，强制折行
3		1.3.开启了单选功能	给单选的表头添加文字，例如“单选”，撑开表头
4	2.横向/行对不齐	2.1.固定(fixed)列的高度高于普通列	1.左侧fixed不对齐：检查是否rowkey唯一 2.右侧fixed不对齐：解决方案PR审核中
5	3.列间有空白间隙/留白	3.1.列数不固定、需适配不同尺寸屏幕	动态设置fixed，比较列总宽与table宽度
6		3.2.scroll.x计算错误	设置scroll.x为所有列的总宽度，包括fixed列
7	4.双滚动条	4.1.macOS在系统偏好设置为 “显示滚动条-滚动时”会出现双滚动条	自定义滚动条，滚动条常显