Ant Design 表格：多行内容上下居中显示实现方法

要实现 Ant Design 表格内容展示多行时的上下居中，可以使用'ellipsis'属性来控制内容溢出时的显示方式，并设置'whiteSpace'属性为'normal'，这样可以让内容自动换行。

另外，可以使用自定义的样式来设置表格单元格的高度和垂直居中方式。

以下是一个示例代码：

import React from 'react';
import { Table } from 'antd';

const data = [
  {
    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'
  },
  {
    key: '3',
    name: 'Joe Black',
    age: 32,
    address: 'Sidney No. 1 Lake Park'
  }
];

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
    ellipsis: true,
    render: (text) => <div style={{ height: '60px', display: 'flex', alignItems: 'center' }}>{text}</div>
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
    ellipsis: true,
    render: (text) => <div style={{ height: '60px', display: 'flex', alignItems: 'center' }}>{text}</div>
  },
  {
    title: 'Address',
    dataIndex: 'address',
    key: 'address',
    ellipsis: true,
    render: (text) => <div style={{ height: '60px', display: 'flex', alignItems: 'center' }}>{text}</div>
  }
];

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

export default App;

在上面的代码中，通过设置'ellipsis: true'来实现内容溢出时的省略显示，然后通过'render'函数来自定义单元格的展示方式，设置单元格的高度为60px，并使用'display: flex'和'alignItems: center'来实现垂直居中效果。