React Virtualized table с CellMeasurer неправильно вычисляет высоту - PullRequest
0 голосов
/ 24 января 2019

У меня странная проблема.Виртуализированная таблица реакции с CellMeasurer неправильно рассчитывает высоту.

Моя функция рендеринга выглядит примерно так: -

<Table
    deferredMeasurementCache={this._cache}
    className={mainClasses}
    width={500}
    height={500}
    headerHeight={headerHeight}
    rowHeight={this._cache.rowHeight}
    rowCount={dataList.length}
    sort={this.sort}
    sortBy={sortBy}
    sortDirection={sortDirection}
    rowGetter={({ index }) => dataList[index]}
    rowRenderer={this.rowRenderer}
    overscanRowCount={overscanRowCount}
    onRowClick={onRowClick}
>
    {
    columnsDef.map((item, index) => {
        if (index === 0) {
            return (
                <Column
                    key={item.dataKey}
                    dataKey={item.dataKey}
                    width={25}
                    cellRenderer={this.checkboxCellRenderer}
                    disableSort={!this.isSortEnabled(item)}
                    headerRenderer={this.checkBoxHeaderRenderer}
                />
                        );
                    }

                    return (
                        <Column
                            key={item.dataKey}
                            dataKey={item.dataKey}
                            width={item.width ? item.width : 0}
                            label={item.label}
                            cellRenderer={this.dynamicCellRenderer}
                            disableSort={!this.isSortEnabled(item)}
                            headerRenderer={this.headerRenderer}
                            flexGrow={item.flexGrow}
                        />
                    );
                })
            }
</Table>

Моя функция рендеринга динамической ячейки выглядит следующим образом: -

dynamicCellRenderer = (data) => {
    return (
        <CellMeasurer
            cache={this._cache}
            columnIndex={0}
            key={data.cellData}
            parent={data.parent}
            rowIndex={data.rowIndex}
        >
            <div
                style={{
                    whiteSpace: 'normal'
                }}
            >
                {data.cellData}
            </div>
        </CellMeasurer>
    );
}

У меня определен кеш в конструкторе: -

constructor(props) {
    super(props);

    this._cache = new CellMeasurerCache({ minHeight: props.rowHeight, fixedWidth: true });
}

Может кто-нибудь помочь мне с тем, где я ошибаюсь.Я что-то упустил с реализацией CellMeasurer?Любая помощь приветствуется.Заранее спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...