react-virtualized icon indicating copy to clipboard operation
react-virtualized copied to clipboard

InfiniteLoader, WindowScroller, AutoSizer, List use together,but only the first fetched data is loaded, I also tried it according to the official document code, but I did not achieve the data effect of scrolling rendering, I hope to get help

Open shengbenqiang opened this issue 3 years ago • 4 comments

Bug Report

What is the current behavior?

InfiniteLoader scrolling loadMoreRows method successfully obtains data, but only renders the data entered for the first time when scrolling

What is the expected behavior?

InfiniteLoader scrolling can render the acquired data list normally。I guess it may be the reason for the height. I did a simple test. In the case of a large height, the data can be continuously rendered. It's just my personal guess, I can't be sure.

Which versions of React and react-virtualized, and which browser / OS are affected by this issue? Did this work in previous versions of react-virtualized?

Browser chrome
OS Windows
React 17.0.2
React DOM 17.0.2
react-virtualized 9.22.3

code

<div className={"home-list-house-list-con"}> {/* @ts-ignore */} <InfiniteLoader loadMoreRows={loadMoreRows} isRowLoaded={isRowLoaded} rowCount={houseCount}> {({ onRowsRendered, registerChild }) => ( // @ts-ignore <WindowScroller> {({ height, isScrolling, scrollTop }) => ( // @ts-ignore <AutoSizer> {({ width }) => ( // @ts-ignore <List autoHeight width={width} height={height} rowCount={houseCount} rowHeight={120} rowRenderer={rowRendererList} isScrolling={isScrolling} scrollTop={scrollTop} onRowsRendered={onRowsRendered} ref={registerChild} /> )} </AutoSizer> )} </WindowScroller> )} </InfiniteLoader> </div>

1650769825(1)

The data below is not getting rendered

shengbenqiang avatar Apr 24 '22 03:04 shengbenqiang

I have this same issue over here. Any solution?

viniciusgrippe avatar May 03 '22 12:05 viniciusgrippe

I also have this same issue over here. Any solution?

vickypanwala avatar May 03 '22 13:05 vickypanwala

This was a bug inside the WindowScroller feature of react-virtualized. So I extracted the feature, fix the bug and some other issues it had and pushed it as a standalone module to npm. You can install the module with yarn add rv-window-scroller or npm install rv-window-scroller

nkemcels avatar Mar 25 '23 20:03 nkemcels

rv-window-scroller

didn`t work for me, the same problem

MykolaKhilko avatar Jan 09 '24 16:01 MykolaKhilko