antd的table组件设置Column的width列宽度不生效问题
合集下载
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
antd的table组件设置Column的width列宽度不⽣效问题
超长连续字段（长数字和长单词）破坏表格布局的问题（即使你指定了列的宽度也会被挤开），之前组件内默认加过 word-break: break-word; 去纠正此类布局，⼜会引起其他的问题。
所以最好的解决⽅案可能还是不默认 break word，提供⼀个属性来针对某些列进⾏断⾏处理。
columns={[
...
textWrap: 'word-break',
]}
还可以⽀持
columns={[
...
ellipsis: true,
]}
注意，在 3.24.0 之前，你需要针对超长字段的列增加折断样式：
columns={[
...
render: (text, record) => (
<div style={{ wordWrap: 'break-word', wordBreak: 'break-word' }}>
{text}
</div>
),
]}
已经在 3.24.0 ⾥解决了超长字段破坏列对齐的问题，并增加了省略功能。