问题
I have a list of labels that I render with a React-Spring Transition. The idea is that you can add items and if you have more than 5, a "Show more" button will appear. Pressing this button toggles wether you're showing all of the labels or just the first five.
The problem is when I pass from "Showing more" to "Showing less". I noticed that before my items were hidden, all of them but the first moved to the beggining of the list, generating a weird effect where you can see the first labels change their text and disappear, before leaving the last ones (with the first labels' text).
I've attached a small sandbox that reproduces this problem. It has 10 items and you can open and close it, but it reproduces this weird bug: https://codesandbox.io/s/thirsty-mountain-ut3r9
Any tips on how to solve it?
回答1:
Finally I have it. If you upgrade react-spring version to 9 beta and remove the reset from the transition it works as expected.
https://codesandbox.io/s/adoring-tu-yypii
来源：https://stackoverflow.com/questions/56604717/react-spring-usetransition-shuffles-my-list-items-around