在 antd pro 中,行合并可以通过 Table 组件的 rowSpan 属性来实现。

具体步骤如下:

  1. 在 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. 在回调函数中判断当前行是否需要合并单元格,如果需要合并,则返回合并的单元格数,否则返回 1。

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

antd protable 如何进行行合并

原文地址: http://www.cveoy.top/t/topic/cwar 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录