Umi & Ant Design Table组件expandable展开功能踩坑记录

React 的 Ant Design 的 Table 表格组件有一个 expandable 属性，是展开功能的配置。

其中有一个属性 expandedRowClassName ，官方的说明是展开的行，控制属性。但是我加了之后，怎么都渲染不出来。

expandable= {{
  expandedRowClassName: () => 'aaa',
}}

后面查资料说可以搭配 indentSize 属性使用。

indentSize ：展示树形数据时，每层缩进的宽度，以 px 为单位。

加了之后，缩进是变了，但 className 还是没有渲染出来。

expandable: {
  expandedRowClassName: () => 'aaa',
  indentSize: 22,
}

直到和 expandedRowRender （额外的展开行）搭配使用才知道，expandedRowClassName 是给额外的展开行添加类名的。

expandable: {
  expandedRowRender: (record) => {
    return <span>{record.name}</span>;
  },
  expandedRowClassName: () => 'aaa',
  indentSize: 22,
}

这样也没才能渲染出来类名，不过不是我想要的，白折腾了。

未经允许不得转载：w3h5 » Umi & Ant Design Table组件expandable展开功能踩坑记录