antd table 如何以行分割单元格

您可以使用 render 属性来自定义单元格内容。在 render 函数中，您可以根据需要添加分隔线。以下是一个示例：

import { Table } from 'antd';

const dataSource = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    address: 'New York No. 1 Lake Park',
  },
  {
    key: '2',
    name: 'Jim Green',
    age: 42,
    address: 'London No. 1 Lake Park',
  },
];

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
    render: (text, record) => (
      <div>
        <div>{text}</div>
        <div style={{ borderTop: '1px solid #e8e8e8', paddingTop: 5 }}>
          {record.address}
        </div>
      </div>
    ),
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
  },
];

function App() {
  return <Table dataSource={dataSource} columns={columns} />;
}

在上面的示例中，我们使用了 render 函数来自定义 Name 列的内容。我们在函数中返回一个包含两个 div 元素的组件。第一个 div 显示了姓名，第二个 div 显示了地址，并添加了一条分隔线。

您可以根据需要调整分隔线的样式和位置