Динамическое добавление строк в React-data-grid

Question

Я только начал изучать React-data-grid и заметил, что вы должны установить rowCount, что заставило меня задуматься, возможно ли динамическое добавление большего количества строк.Я использую веб-сокеты, чтобы получить данные, которые будут добавлены в таблицу в виде строк.Это может быть убийцей сделки, если это не поддерживается.

Answer 1

Доступно динамическое добавление строк.Предположим, что вы сохраняете контент в состоянии:

this.state = {
    rows: this.props.content,
};

Кроме того, у вас есть функция, которая получает новый контент с сервера и обновляет состояние:

getNewData() {
    const newData = this.props.someMagicFunction();
    this.setState(prevState => ({rows: [...prevState.rows, ...newData]}));
}

rowsCount не проблема, потому что вы можете прочитать его как this.state.rows.length, поэтому, когда вы обновляете свои строки в состоянии, вы получаете обновленный rowCount.

Renderer:

<ReactDataGrid
    columns={this.props.heads}
    rowGetter={this.rowGetter}
    rowsCount={this.state.rows.length}
/>