物品混乱地跳来跳去

时间:2018-03-04 15:57:34

标签: reactjs react-virtualized

当我移动滚动条少量时,单元格会跳转。它根本不是平滑滚动。这是代码的错误还是性能极差?当我移除细胞测量器时它也会这样做。

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>
        );
    }

0 个答案:

没有答案