当您在反应弹簧中滚动浏览块时，如何启动块的动画?

Question

当你在反应弹簧中滚动浏览一个块时，如何开始它的动画？

Answer 1

我喜欢在这个应用程序中使用Waypoint。它是一个组件，您可以将其放置在页面中的任何位置。例如到顶部、中间或底部。通常我把它放在我想用它控制的组件之前或之后。它可以在进入页面或离开页面时触发事件。您可以做的所有事情来控制这些事件中的反应弹簧动画。例如：

<Waypoint
onEnter={() => setScale(true)}
onLeave={() => setScale(false)}
/>

这里有一个小例子：https://codesandbox.io/s/website-logo-animation-with-react-spring-gcqhr