loadMore function does not fire with table

[animeshchat]

Hi there,

First of all - great component. I've used it for many projects. Thanks for maintaining it!

I recently tried using it to make the rows of a table infinite scroll, but the loadMore function does not fire. I tried something like this -

<table>
    <thead>
        <tr>
            <th></th>
            <th></th>
        </tr>
    </thead>
    <InfiniteScroll 
        initialLoad={false}
        hasMore={true}
        loadMore={loadMore}
        element={'tbody'}
        useWindow={true}>
        {people..map(person => (
                <tr key={person.id}>
                    <td>{person.age}</td>
                    <td>{person.age}</td>
                </tr>
            ))}
    </InfiniteScroll>
</table>

I've read others report that they got it to work with tables, but couldn't find a solution.

I don't want to move to another component just for the table use-case.

Could someone help out?

[satya-vinay]

@animeshchat, Were you able to find a solution to it?

[animeshchat]

Nope, I didn't.

I had shrugged this under the mat, but it's becoming hard to ignore. I might fork and attempt to fix. I'll post the link here when I do.

[wenlittleoil]

Maybe you should see this, it solved the same problem. https://github.com/danbovey/react-infinite-scroller/issues/168#issuecomment-423790530