如何以编程方式导航到 antd table 组件的最后一页或第 n 页？

Question

我正在向带有分页组件的 antd table 组件添加一个新项目，并希望将 table 内容导航到分页中的最后一页或第 n 页。如何以编程方式导航到带有 antd 分页的 antd table 组件的最后一页或第 n 页？

Answer 1

可以通过Table[pagination]来控制，见：https://ant.design/components/table/#Table

Answer 2

我是这样解决的：

1) 将分页对象添加到组件状态

constructor(props) {
        super(props);

        this.state =
            {
                pagination: null,
            };
    }

2) 在您的组件渲染方法中将分页从组件状态传递到表分页属性：

    ...
    <Table
        dataSource={dataSource}
        ...
        pagination={this.state.pagination}
    />
    ...

3) 在您选择的组件事件处理程序中，您现在可以使用 SetState 来设置分页对象。例如，在将新项目添加到 table:

后，我导航到分页的最后一页

handleCreateItem = () => {
        ...
        let pagination = {
            current: YourNewCurrentPageInPagination,
            maxSize: YourNewMaxSizeGridValue
        }
        ...
        this.setState({
            pagination: pagination
        })
        ...
}

如何以编程方式导航到 antd table 组件的最后一页或第 n 页？

How to programatically navigate to the last or n-th page of antd table component?

pagination

reactjs

antd