reactjs 一个带有分页控件的表格，支持一个小部件来选择每页的行？

qojgxg4l 于 2023-03-01 发布在 React

关注(0)|答案(2)|浏览(107)

Ant设计表控制器是否接受分页组件，而不是属性的普通对象。我需要添加一个切换器，在每页的行之间切换。
目前它是在分页组件中实现的。

2条答案

如果您需要的只是选择每页行数的能力，那么下面的代码应该适合您：

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

基本上就是将分页属性 Package 到分页对象中，并将其传递给Table组件。
如果你需要更多的定制，你可以考虑关闭默认的Table分页，并连接你的定制分页组件。

上面的示例是实现自定义分页的一种简单方法，但是我注意到getData函数有一个小问题，如果使用该函数，表永远不会呈现数据数组中的最后一项，相反，您可能希望将其更改为类似于

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