从图片的内容可以看到表头的宽度与内容的宽度是不一致的，但是使用的是默认的antd的样式。为什么会出现这种情况呢？ 罪魁祸首是表格的 scroll 属性，可以从图片中看到该表格有一个纵向的滚动轴，虽然我们只设置了滚动轴的 Y 轴宽度，但是也会影响 X 轴，造成表头与内容列宽不一致。 解决办法： 在定义表头时，给每一列增加列宽，类似：
const columns = [ { title: '账户', dataIndex: 'id', width: 120, // 解决方法 sorter: (a, b) => a.id - b.id }, { title: '服务器', dataIndex: 'server', width: 120, filters: serverFilter, filterMultiple: true, onFilter: (value, record) => { return value === record.server } } ]