Ant Design Pro Table 行合并实现教程

在 Ant Design Pro 中，行合并可以通过 Table 组件的 'rowSpan' 属性来实现。

具体步骤如下：

在 Table 组件中设置 'rowSpan' 属性，该属性接收一个回调函数作为参数，该回调函数的参数为当前行数据对象和当前行数据的索引，返回值为该行需要合并的单元格数。

<Table dataSource={dataSource} columns={columns}>
  <Column
    title='姓名'
    dataIndex='name'
    key='name'
    rowSpan={(record, index) => {
      // 判断是否需要合并
      if (record.name === 'Lucy') {
        return 2;
      }
      return 1;
    }}
  />
  <Column title='年龄' dataIndex='age' key='age' />
  <Column title='地址' dataIndex='address' key='address' />
</Table>

在回调函数中判断当前行是否需要合并单元格，如果需要合并，则返回合并的单元格数，否则返回 1。

上述代码中，如果当前行数据的 'name' 属性为 'Lucy'，则需要将该行合并到下一行，所以返回值为 2；否则返回 1，表示该行不需要合并。