A tiny but mighty 3kb list virtualization library, with zero dependencies 💪 Supports variable heights/widths, sticky items, scrolling to index, and more!
I am working on a horizontal timeline that uses react-tiny-virtual-list to reduce the amount of items rendered at any one time. Clicking on an item on this timeline should center it horizontally. I noticed that when clicking on an item after scrolling, the item would not center.
This fixes instances where, right after scrolling, a change in the scrollToIndex prop will not actually scroll to the item at the passed index correctly. This is due to the componentDidUpdate method considering the previous state to actually be the next state and looking at scrollChangeReason on it, seeing the old scrollChangeReason caused by the user scrolling, thus not calling scrollTo to actually center the element.
I am working on a horizontal timeline that uses
react-tiny-virtual-list
to reduce the amount of items rendered at any one time. Clicking on an item on this timeline should center it horizontally. I noticed that when clicking on an item after scrolling, the item would not center.This fixes instances where, right after scrolling, a change in the
scrollToIndex
prop will not actually scroll to the item at the passed index correctly. This is due to thecomponentDidUpdate
method considering the previous state to actually be the next state and looking atscrollChangeReason
on it, seeing the oldscrollChangeReason
caused by the user scrolling, thus not callingscrollTo
to actually center the element.