Nested vistualizers

[suryaashish-tyke]

As shown in the above image
I am having a list of items (Red-box) which in turn will have its own list of items (blue-box) and fetched when is opened.

The problem I am facing is when first open the nested list I am getting a blank list

WhatsApp.Video.2024-10-22.at.23.41.13.mp4

[piecyk]

Each nested list needs to have the correct scrollMargin set, which determines where the scroll offset should start. Additionally, all the nested lists should share the same scrolling element to ensure proper rendering.

[suryaashish-tyke]

Thanks @piecyk for the reply, will try this and update you

[johnhok]

@suryaashish-tyke I saw your question here and it looks somewhat similar to what I've been trying to do. I'm assuming the blue bits are also intended to be virtualized? Did you have any luck with your implementation? I've been having issues with scroll when trying to nest virtualizers like this. Any pointers would be helpful!

Link to my thread with a code sample: #876

[suryaashish-tyke]

No luck @johnhok

[suryaashish-tyke]

Found the issue @piecyk , @johnhok

In my case the div which holds the scrollable container, is conditionally rendered and the initial ref being null the contents are not getting rendered(since there is no container(ref))

With this change now whenever the VirtualList is rendered the ref will be attached and having a value.