这是第一篇测试

5 评论
156 views

目录:

Table 行列合并

const columns = [
  {
    title: 'Home phone',
    colSpan: 2,
    dataIndex: 'tel',
    onCell: (_, index) => {
      if (index === 3) {
        return {
          rowSpan: 2,
        };
      }
      if (index === 4) {
        return {
          rowSpan: 0,
        };
      }
      if (index === 1) {
        return {
          colSpan: 0,
        };
      }
      return {};
    },
    render: (text, record) => (
      <span style={{backgroundColor: 'rgb(217, 219, 223)'}}>
        {text}
      </span>
    ),
  },
  // 其他列的配置...
];

​ • colSpan: 2 表示这个列跨两列。

​ • dataIndex: 'tel' 指定了数据源字段的键名。

​ • onCell 方法用于定义特定单元格的合并规则：

​ • 如果是第 3 行，设置 rowSpan: 2 表示这个单元格会跨两行。

​ • 如果是第 4 行，设置 rowSpan: 0 表示这个单元格会被合并到第 3 行的单元格。

​ • 如果是第 1 行，设置 colSpan: 0 表示这个单元格会被前一个单元格合并。

​ • render 方法用于自定义单元格的内容和样式，将单元格背景色设置为 rgb(217, 219, 223)。