Antd表格跨行

• 组件

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

• columns（关键）

在需要合并的行的columns种，设置rowSpan。

当rowSpan值为0时，不渲染表格。

const columns = [
    {
        title: 'Name',
        dataIndex: 'name',
    },
    {
        title: 'Home phone',
        colSpan: 2,
        dataIndex: 'tel',
        render: (value, row, index) => {
            const obj = {
                children: value,
                props: {},
            };
            // rowSpan行 从index开始合并3行，值为第一个值
            if (index === 0) {
                obj.props.rowSpan = 3;
            }
            // 从index+1开始，设置rowSpan=0，不渲染表格
            if (index === 1 || index === 2) {
                obj.props.rowSpan = 0;
            }
            return obj;
        },
    },
];

• data

const data = [
    {
        key: '1',
        name: 'John Brown',
        tel: 'test1',
    },
    {
        key: '2',
        name: 'Jim Green',
        tel: '0571-22098333',
    },
    {
        key: '3',
        name: 'Joe Black',
        tel: '0575-22098909',
    },
    {
        key: '4',
        name: 'Jim Red',
        tel: '0575-22098909',
    },
];