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

qojgxg4l  于 2023-03-01  发布在  React
关注(0)|答案(2)|浏览(108)

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

db2dz4w8

db2dz4w81#

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

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

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

epfja78i

epfja78i2#

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

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

相关问题