How can I sync two virtual lists (with no lag)
Hey, the goal is the following :
Syncing (with no lag) the scrollTop value of two virtual lists that are in different scroll containers.
The two lists have same number of elem + same eleme height but the rest is different so I cant use lane=2.
I've tried having one ref on each list and listen for the onScroll event then update the scroll of the other but there is an unpleasant lag when the component are not trivial.
I'm pretty sure I'm missing something in the tanstack doc because this should not be that hard I hope ?
My hope would be to have only one scrollTop value and share it with the two lists but I've been unsuccessfull for now.
Please help :D
1 Reply
extended-salmon•2mo ago
Yep, best way is to wrap both lists in a single scroll container and pass that same scrollElement to both virtualizers. That way they stay perfectly in sync without needing to manually forward scrollTop between refs. No lag, no extra logic needed 👍