将自定义元素添加到 React Table pagination-top

Question

我希望有条件地向我的 React Table 添加一个按钮，并使其显示在 PaginationTop 部分中行大小选择器的右侧。

该项目目前正在使用 react-table 6.9.2。

目前 table 仅使用 showPaginationTop 作为 ReactTable 组件中的参数，在一些自定义 css 之后导致此 header：

随着自定义元素的显示，我希望它显示为：

有谁知道如果不更改 PaginationTop 的 react-table 来源是否可行？

Answer 1

糟糕，这可以通过此处文档中提到的组件覆盖来完成： https://github.com/tannerlinsley/react-table/tree/v6#component-overrides

对于我的解决方案，这涉及制作一个新组件并将其设置为默认组件：

Object.assign(ReactTableDefaults, {
  PaginationComponent: Pagination,
...

Add custom elements to React Table pagination-top