diff --git a/examples/100k-rows-aggregation/package.json b/examples/100k-rows-aggregation/package.json index 3f2f575..7e99366 100755 --- a/examples/100k-rows-aggregation/package.json +++ b/examples/100k-rows-aggregation/package.json @@ -20,4 +20,4 @@ "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" } -} \ No newline at end of file +} diff --git a/src/pagination.js b/src/pagination.js index 551f767..bddb136 100644 --- a/src/pagination.js +++ b/src/pagination.js @@ -1,3 +1,4 @@ +/* eslint-disable react/no-did-update-set-state */ import React, { Component } from 'react' import classnames from 'classnames' @@ -71,6 +72,14 @@ export default class ReactTablePagination extends Component { page: this.props.page, }) } + /* when the last page from new props is smaller + than the current page in the page box, + the current page needs to be the last page. */ + if (this.props.pages !== prevProps.pages && this.props.pages <= this.state.page) { + this.setState({ + page: this.props.pages - 1, + }) + } } getSafePage (page) { @@ -148,7 +157,7 @@ export default class ReactTablePagination extends Component { if (!canPrevious) return this.changePage(page - 1) }} - disabled={!canPrevious} + disabled={!canPrevious || this.state.page < 1} > {this.props.previousText} @@ -160,13 +169,13 @@ export default class ReactTablePagination extends Component { {this.props.ofText} {renderTotalPagesCount(pages)} {showPageSizeOptions && - renderPageSizeOptions({ - pageSize, - rowsSelectorText: this.props.rowsSelectorText, - pageSizeOptions, - onPageSizeChange, - rowsText: this.props.rowsText, - })} + renderPageSizeOptions({ + pageSize, + rowsSelectorText: this.props.rowsSelectorText, + pageSizeOptions, + onPageSizeChange, + rowsText: this.props.rowsText, + })}
= this.props.pages - 1} > {this.props.nextText}