要在 Antd Table 的单元格中实现内容上下居中,可以使用 CSS 样式来实现。首先,给表格单元格的类名添加一个样式:

.cell-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

然后,在 Table 组件的 columns 中的对应列的 render 方法中,给单元格的 className 属性添加该样式类名:

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
    render: (text) => <div className='cell-center'>{text}</div>,
  },
  // 其他列...
];

这样,单元格中的内容就会上下居中显示了。

Antd Table 单元格内容垂直居中:实现指南

原文地址: https://www.cveoy.top/t/topic/qnJq 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录