react-infinite-scroller icon indicating copy to clipboard operation
react-infinite-scroller copied to clipboard

onLoadMore does not get called anymore

Open abhiakshay opened this issue 5 years ago • 18 comments

upon scroll to the end, does not trigger the onLoadMore despite hasMore=true Version 1.2.4 here is the configuration used threshold={200} initialLoad={false} loadMore={() => console.log('load more')} hasMore={true} useWindow={false}

abhiakshay avatar Dec 05 '19 06:12 abhiakshay

This has been driving me nutty. I'm glad it's not just me. Is there an ETA on this?

brianwilliams-mubaloo avatar Dec 18 '19 15:12 brianwilliams-mubaloo

If you do it slowly it loads more rows, but if you scroll fast enough to the end nothing gets called, is that what you're seeing as well @brianwilliams-mubaloo @abhiakshay ?

DarthCharles avatar Dec 20 '19 20:12 DarthCharles

@brianwilliams-mubaloo @abhiakshay Did you find a solution? It suddenly stopped working for me too...

grazianodev avatar Jan 06 '20 13:01 grazianodev

i just started trying to use this library, and when I scroll to the bottom it just repeatedly calls loadMore until it's out of pages. not sure if this is the same thing you're experiencing

dcporter44 avatar Jan 22 '20 01:01 dcporter44

Nope, but I had that issue as well and I solved it by setting initialLoad={ false } and fetching the first page manually, which was a requirement for me anyway. When you do that, the library fetches the subsequent pages correctly.

I also seem to have fixed the issue discussed in this thread. For me, what works (at least for me) is adding a 10px padding at the bottom of a container div that wraps the loading component.

grazianodev avatar Jan 22 '20 07:01 grazianodev

@grazianodev Yes, it solves the issue

alex-shamshurin avatar Feb 11 '20 11:02 alex-shamshurin

Hit the same issue. Driving me nuts. Any update on this issue?

damechen avatar Apr 04 '20 17:04 damechen

@grazianodev It didn't work for me :(

damechen avatar Apr 04 '20 17:04 damechen

i just started trying to use this library, and when I scroll to the bottom it just repeatedly calls loadMore until it's out of pages. not sure if this is the same thing you're experiencing

What you can do as work around is set flag like isLoading, when you send your request set it to true, on response false, and set hasMore=(!isLoading && (...)).

stanojevic-ivan-toptal avatar Apr 08 '20 14:04 stanojevic-ivan-toptal

it didn't work for me,

NguyenTrungMax avatar Apr 12 '20 03:04 NguyenTrungMax

loadmore is not getting called!

divjyot3112 avatar Apr 24 '20 10:04 divjyot3112

<div style={{ height: document.body.clientHeight - 250, overflow: 'auto' }}>
    <InfiniteScroll
        initialLoad={false}
        loadMore={async (current) => {
            console.log('loadmore will never trigger', current);
            this.setState({requesting:true})
            await myRequest();
            this.setState({requesting:false})
        }}
        hasMore={!this.state.requesting && this.state.hasNext}
        threshold={20}
        useWindow={false}
    >
        <Table />
    </InfiniteScroll>
</div>

mqliutie avatar May 25 '20 09:05 mqliutie

Nope, but I had that issue as well and I solved it by setting initialLoad={ false } and fetching the first page manually, which was a requirement for me anyway. When you do that, the library fetches the subsequent pages correctly.

I also seem to have fixed the issue discussed in this thread. For me, what works (at least for me) is adding a 10px padding at the bottom of a container div that wraps the loading component.

experiencing this as well and the above fix works for me, but is there an explanation to this?

jamessspanggg avatar Jul 16 '20 16:07 jamessspanggg

In my case I forgot to add height attribute to the parent <div>. Once added the issue got resolved.

atinyakov avatar Jul 28 '20 11:07 atinyakov

I figured out the cause of this issue in my case, I was trying to use the infinite scroll functionality with useWindow={true} and the issue turned out to be caused by a parent div which had overflow: auto specified, I got rid of that and everything works now as expected! 😄

Emad-salah avatar Aug 28 '20 11:08 Emad-salah

I figured out the cause of this issue in my case, I was trying to use the infinite scroll functionality with useWindow={true} and the issue turned out to be caused by a parent div which had overflow: auto specified, I got rid of that and everything works now as expected! 😄

That's weird 'cause the examples uses parent with overflow: auto;

olelivalife avatar Aug 28 '20 11:08 olelivalife

Any update on this issue? This randomly stopped working for me. Works if I remove initialLoad={false} but then the function calls infinitely times.

arvidnilber avatar Nov 17 '20 22:11 arvidnilber

Is this project dropped or something? I tried the above-mentioned fixes but sadly none worked.

lazycipher avatar Aug 12 '21 13:08 lazycipher