React-Spring useTransition随机排列我的列表项

时间:2019-06-14 20:23:46

标签: reactjs react-spring

我有一个用React-Spring Transition渲染的标签列表。 这个想法是您可以添加项目,如果数量超过5个,则会显示“显示更多”按钮。按下此按钮可以切换显示所有标签还是仅显示前五个标签。

问题是当我从“显示更多”变为“显示较少”时。我注意到,在隐藏我的项目之前,除第一个标签外,所有其他标签都移到了列表的开头,产生了一种怪异的效果,您可以看到第一个标签更改了它们的文本并消失了,然后留下了最后一个标签(带有第一个标签)文字)。

我附上了一个小沙盒,它再现了这个问题。它有10个项目,您可以打开和关闭它,但是它重现了这个奇怪的错误:https://codesandbox.io/s/thirsty-mountain-ut3r9

有任何解决方法的提示吗?

1 个答案:

答案 0 :(得分:1)

最后我有它。如果将react-spring版本升级到9 beta,然后从过渡中删除重置,它将按预期工作。

https://codesandbox.io/s/adoring-tu-yypii