react antd 表格拆分

Question

各位大神，现在有一个需求是在antdesign框架里，将表格Table的一行拆分为两份，如图所示，请问有什么好的方法吗

<Table
    dataSource={data}
    rowSelection={rowSelection}
    columns={columns}
/>

const columns = [
...
{ title: '能耗分类', key: 'a', dataIndex: 'addressName'},
...
]

我想通过render自定义渲染，将能耗分类平均拆成两份，上面为热量，下面为冷量，怎么在render里做处理

Answer 1

antd本身支持列自定义渲染,链接：https://github.com/ant-design...

render?: (text: any, record: T, index: number) => React.ReactNode;

column传一下render想怎么拆都行

{ 
    title: '能耗分类', 
    key: 'a', 
    dataIndex: 'addressName',
    render(text, record, index) => (<>
    <div>{record.hot}</div>
    <div>{record.cold}</div>
    </>)
    },