Горизонтальная прокрутка в React Table

Question

У меня проблема с получением довольно базовой функциональности, т.е. Я хотел бы установить горизонтальную прокрутку для таблицы React, когда страница меньше, чем размер таблицы. В моем коде нет ничего необычного, но я все равно оставлю это здесь:

<ReactTable
  data={bookingPerson}
  columns={columns}
  className="-striped -highlight"
  defaultPageSize={7}
  loading={loading}
/>

Answer 1

Просто добавьте стиль с высотой 400px, что заставит его иметь возможность прокрутки.

<ReactTable
      data={bookingPerson}
      columns={columns}
      className="-striped -highlight"
      defaultPageSize={7}
      loading={loading}
      style={{
        height: "400px"
      }}
 />

Answer 2

используйте для этой цели реагирующую виртуализированную / многосеточную сетку. Это подходит для вашего примера. Единственная проблема, с которой вы можете столкнуться - вам нужно преобразовать tableData из массива объектов в массив массивов.