In this episode, we quickly sort out a minor but annoying reactivity issue in our app. Previously, whenever you scrolled way down the list and clicked on an item, the page would jump you right back to the top—which is pretty frustrating!
We look into why this happens: it turns out that our scroll container resets to the top whenever its render key changes. The fix is straightforward—by being a bit more careful about where we apply the render key, either to a child div or an input, the scroll position will stay put when it should. It's not the most elegant solution, but it gets the job done.
To make sure the fix works, we test it out by scrolling to deep items in our massive list and playing with different browser sizes. Everything works smoothly now! In the next episode, we'll tackle making the UI more responsive, so things won't get cut off on smaller screens.