Reactjs react数据网格可变高度行

我有一个react数据网格，它需要可变的行高度

<ReactDataGrid
    ref={node => this.grid = node}
    enableCellSelect
    columns={columnDefs}
    rowGetter={this.rowGetter(this)}
    rowsCount={this.props.table.length}
    rowRenderer={RowRenderer}
    rowHeight={50}
    rowScrollTimeout={200}
    minHeight={550}
    minColumnWidth={15}
/>

this.grid=node}
enableCellSelect
columns={columnDefs}
rowGetter={this.rowGetter（this）}
rowsCount={this.props.table.length}
rowRenderer={rowRenderer}
行高={50}
rowScrollTimeout={200}
最小高度={550}
minColumnWidth={15}
/>

大多数情况下，我使用行渲染器并动态计算行高度

class RowRenderer extends React.Component {
    setScrollLeft(scrollBy) {
        this.refs.row.setScrollLeft(scrollBy);
    }

    getRowHeight() {
        const rowLines = Math.ceil((this.props.row.desc.length + 1) / 150);
        return rowLines * 50;
    }

    render() {
        return (
            <ReactDataGrid.Row
                ref="row"
                {...this.props}
                height={this.getRowHeight()}
            />
        );
    }
};

类行渲染器扩展React.Component{
设置滚动左（滚动）{
this.refs.row.setScrollLeft（滚动）；
}
getRowHeight（）{
const rowLines=Math.ceil（（this.props.row.desc.length+1）/150）；
返回行*50；
}
render（）{
返回(
);
}
};

但是，由于虚拟化创建的div使用固定的行高，所以滚动无法正常工作

---

我试图找到一种方法来重载一个处理滚动的函数，但没有找到一种方法。有没有办法过载滚动并设置高度，使其平滑滚动

我最后使用过扫描并将可见列设置为始终为0

// extend third party lib react-data-grid ReactDataGrid
import ReactDataGrid from 'react-data-grid';


class TableDataGrid extends ReactDataGrid {
    render() {
        // force viewport columns to always start from zero
        // to prevent row re-rendering when scrolling horizontally
        if (this.base && this.base.viewport) {
            this.base.viewport.getVisibleColStart = () => 0;
        }
        return super.render();
    }
}

module.exports = TableDataGrid;

不漂亮，但它适用于Chrome和Firefox。safari仍然存在一个呈现问题，其中标头没有与数据行保持同步，但它可以正常工作

// extend third party lib react-data-grid ReactDataGrid
import ReactDataGrid from 'react-data-grid';


class TableDataGrid extends ReactDataGrid {
    render() {
        // force viewport columns to always start from zero
        // to prevent row re-rendering when scrolling horizontally
        if (this.base && this.base.viewport) {
            this.base.viewport.getVisibleColStart = () => 0;
        }
        return super.render();
    }
}

module.exports = TableDataGrid;