Javascript 达到IntersectionObserver阈值时调用setState？

我正在使用

react-spring

和

IntersectionObserver

为页面上的一些div元素设置动画

对于

IntersectionObserver

，我使用了教程中给出的一个钩子

虽然我能够让div自行旋转（

onClick

），并且

useIntersect

正在工作，但当a部分出现时，我无法触发旋转。我尝试过使用

setState

，方法与我对

onClick

所用的方法相同，但由于

条目无效。isIntersecting

属性在每次重新加载期间会多次触发

---

当满足IntersectionObserver阈值时，如何使用react-spring使div旋转？

您可以向useIntersect添加回调参数。并在更新条目时调用它。但它对我不起作用，因为回调在每个渲染中都被调用，并且您希望在回调中触发渲染。所以它给我带来了一个无限循环。所以我建议用别的东西

为此，我通常使用react航路点。它的使用很简单

  <GenerateSection />
  <Waypoint
    onEnter={() => set((flipped) => !flipped)}
    onLeave={() => console.log('leave')}
  />
  <GenerateSection />

集合（（翻转）=>！翻转）}
onLeave={（）=>console.log（'leave'）}
/>

如果只想将useIntersect用于触发动画，则可以将其删除，因为这是不必要的