Unable to load more results when initial list loaded is smaller than container

Hi, really liking the library.

https://codesandbox.io/s/distracted-bogdan-zhcit?file=/src/index.js The above is a working example of inverse scrolling within a fixed height container of 300px.

If you modify the height (line 35) to 800px you’ll see an initial load that looks like:

There doesn’t seem to be any way to then trigger loading the next page of data.

Would this be something that would be possible to be addressed in this library? If there is no scrollbar, but there is still more data to fetch, then trigger the next function until there either is a scrollbar or there is no more data to fetch? Maybe you there is an alternative way to tackle this that I’m not thinking of as well.

Tested on

• Chrome Version 86.0.4240.75
• macOS Mojave Version 10.14.6

[jedster1111]

@ADCrouch I ended up figuring something out, tried to recreate it in CodeSandbox. It’s a little bit rough around the edges and I couldn’t test the window resizing part but it should be a good enough starting point. https://codesandbox.io/s/vibrant-shannon-05o50?file=/src/Scroller.tsx

The logic is really just, if I’m not scrollable, there’s still data to be loaded, and I’m not already loading, then load some more data. 😄

[toschlog]

It would be super-nice if this logic were built in to react-infinite-scroll-component: If the element isn’t scrollable but more items are available, request more items.