当我移动滚动条少量时,单元格会跳转。它根本不是平滑滚动。这是代码的错误还是性能极差?当我移除细胞测量器时它也会这样做。
isRowLoaded = ({ index }) => {
return index < this.props.shifts.length;
}
loadMoreRows = ({ startIndex, stopIndex }) => {
var p = this.loadShiftsFromServer(startIndex, stopIndex);
return p;
}
rowRenderer = ({ key, index, parent, style }) => {
if (!this.isRowLoaded({ index })) {
return <div>Loading</div>;
}
var s = this.props.shifts[index];
return <CellMeasurer
cache={this._cache}
key={key}
rowIndex={index}
columnIndex={0}
parent={parent}>
{({ measure }) => (
<Shift
key={s.sid}
shiftId={s.sid}
/>
)}
</CellMeasurer>;
}
render() {
return (
<div className={this.props.className + ' list'}>
<InfiniteLoader
isRowLoaded={this.isRowLoaded}
loadMoreRows={this.loadMoreRows}
rowCount={this.props.shifts.length + 1}
>
{({ onRowsRendered, registerChild }) => (
<AutoSizer>
{({ width, height }) => (
<List
width={width}
height={height}
onRowsRendered={onRowsRendered}
ref={registerChild}
rowCount={this.props.shifts.length + 1}
rowHeight={20}
rowRenderer={this.rowRenderer}
/>
)}
</AutoSizer>
)}
</InfiniteLoader>
</div>
);
}