antd

Question

Ant Design Table 控制器是否采用分页组件，而不是普通的属性对象。我需要添加一个切换器，以在每页的行之间切换。

目前在Pagination组件中实现。

Answer 1

如果您只需要 select 每页的行数，那么以下代码应该适合您：

<Table
    dataSource={...}
    pagination={{ defaultPageSize: 10, showSizeChanger: true, pageSizeOptions: ['10', '20', '30']}}
>

基本上将 Pagination props 包装到一个分页对象中，并将其传递到您的 Table 组件中。

如果您需要更多自定义，您可能需要考虑关闭默认 Table 分页并连接您的自定义分页组件。示例代码：

Answer 2

以上示例是实现自定义分页的直接方法。但是，我确实注意到了 getData 函数的一个小问题。如果您使用该函数，table 永远不会呈现数据数组中的最后一项。相反，您可能想将其更改为

const getData = (current, pageSize) => {
return data.slice((current - 1) * pageSize, current * pageSize);
}

antd - 带有分页控件的 ant design table 支持一个小部件来选择每页的行数？