Как сохранить / сохранить выбранное количество строк моей React Table в переменную?- ReactJS

Question

Это моя таблица реакции.По умолчанию я использую 10 строк по умолчанию.Я хочу записать (или лучше сохранить в переменную состояния) количество строк, когда мы выбираем количество строк как 5, 10, 20, 50 и 100 из выпадающего списка.

Когда я выбираю 50 количество строкиз выпадающего списка я хочу сохранить 50 в переменной состояния.Точно так же, когда я выбираю количество строк 100, я хочу сохранить 50 в переменной состояния.

Это моя таблица реакций - https://codesandbox.io/s/42nl1j300w

Редактировать 1: Я получаю эту ошибку после использования ответа @seebiscuit.Это мой код - https://codesandbox.io/s/42nl1j300w

Редактировать 2 - Проблема все еще существует.Если я задаю значение по умолчанию для переменной состояния pageSize как 10, когда я выбираю 20, это печатает 10. После 20, если я выбираю 50, это дает значение как неопределенное.

Я обнаружил, что

onPageSizeChange={(state) => { this.setState({ pageSize: state.pageSize }}}

state.pageSize становится неопределенным, поэтому переменная состояния pageSize также становится неопределенной.

Answer 1

Используйте onPageSizeChange callback prop в <ReactTable> и сохраните pageSize так, как вы хотите.

<ReactTable
  //  ... other props
  onPageSizeChange={(pageSize) => { this.setState({ pageSize }}}
/>