proTable 合并单元格 踩坑

使用ant -design 的proTable 写的表格，要实现最后一行 部门和交易簿 合并单元格，实现以下效果：

踩坑一： 直接在column 上设置colSpan , 是设置在表头上，合并表头。

踩坑二：参考官方文档，使用 onCell: (record, index) => ({ colSpan: (index as number) < 3 ? 1 : 2, }) ; 没有效果。

最后解决方法： 在render 方法 的 props 里面设置 colSpan ，实现单元格合并。

const columns = [
   {
      title: '部门',
      dataIndex: 'departmentName',
      align: 'center',
      hideInSearch: true,
      render: (text, record) => {
        return {
          children: text,
          props: {
            colSpan: record?.departmentName?.includes('合计') ? 2 : 1,
          },
        };
      },
    },
    {
      title: '交易簿',
      dataIndex: 'bookName',
      hideInSearch: true,
      render: (text, record) => {
        return {
          children: text,
          props: {
            colSpan: record?.departmentName?.includes('合计') ? 0 : 1,
          },
        };
      },
    },
    {
      title: 'Delta Cash(元)',
      children: [
        {
          title: '互换合约',
          dataIndex: 'exchangeDeltaCash',
          align: 'right',
        },
        {
          title: '场内对冲',
          dataIndex: 'hedgeDeltaCash',
          align: 'right',
        },
        {
          title: '净Delta Cash',
          dataIndex: 'summaryDeltaCash',
          align: 'right',
        },
      ],
    },
  ]

附上官方文档 表格合并行/列 说明：