New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
react-window-infinite-loader: Invalid list ref #444
Comments
Are you passing the ref from the |
Yeah this is what I have currently: <InfiniteLoader
isItemLoaded={index => index < items.length}
itemCount={1000}
threshold={20}
loadMoreItems={loadMoreItems}
ref={infiniteLoaderRef}
>
{({ onItemsRendered, ref }) => (
<AutoSizer style={{ minHeight: "800px" }}>
{({ height, width }) => (
<VariableSizeGrid
columnWidth={_index => width / numberOfColumns}
columnCount={numberOfColumns}
rowCount={Math.ceil(items.length / numberOfColumns)}
rowHeight={_index => heightOfRow}
height={height}
width={width}
ref={ref}
>
{props => <GridItem {...props} />}
</VariableSizeGrid>
)}
</AutoSizer>
)}
</InfiniteLoader> |
Can you try swapping That worked for me if I remember correctly. |
I am having the same issue even though I have the AutoSizer as the outer component |
Hi @killpowa, do you have an example I can take a look at? |
Hey @chrisneven, Here's the example - codesandbox Thanks in advance. :) |
Hi @DevAKS-Yara, I've taken a look at your example and you're not passing the I've edited your example and implemented a working version The main take away here is that when you want another reference to the list component and also use the |
Oh! I tried passing ref directly from BTW, thanks for the solution! 👍🏼 :) |
You're welcome!
Well you could also directly pass the ref but in this case you apparently need have multiple references. By using a "callback ref" you can assign multiple refs to a DOM node. Preferably you should put it in a |
Thanks you its work |
I've followed the instructions on the infinite loader documentation but I'm still seeing this warning in the console:
Invalid list ref; please refer to InfiniteLoader documentation.
My code:
What am I doing wrong here? Thanks!
The text was updated successfully, but these errors were encountered: