React Table 默认分页页面

Question

我是 React 新手-table。是否可以在分页模式下设置默认页面。是否有某种道具可以处理这个问题？ F.ex。在我的组件安装后，我想在第 5 页打开我的 table。谢谢！

Answer 1

只需在 <ReactTable /> 组件中添加 page prop

  <ReactTable
    ...otherProps
    page={5}
  />

只需将 5 更改为您想要的页码。

Answer 2

您可能已经发现了这一点，但是为了扩展 hariharan 的答案，您可以使用组件的状态来控制 table 的许多道具。对于页面，可以告诉组件在状态下找到页面，

<ReactTable
    ...otherProps
    page={this.state.page}
  />

当你初始化你的状态时，无论你如何初始化它，页面都等于 5。例如，

class MyClassThatHasReactTableInIt extends Component {
  constructor (props) {
    super(props);
    this.state = {
      page: 5
  }
... // etc code etc

如果这样做，您还需要自己处理页面更改。 幸运的是，react-table 使这变得非常简单，您可以编写自定义的 pageChange 处理程序：

    <ReactTable
    ...otherProps
    page={this.state.page}
    onPageChange={page => this.setState({page})}
  />

React Table 默认分页页面

React Table default pagination page

reactjs

react-table