我想我是不小心刷新这个每次滚动发生，这可能是渲染页面上的每一个变化。
我认为问题在于第一次调用window.addeventlistener时，window.addeventlistener从未卸载，然后第二次调用animator时，它装载并卸载自己的事件侦听器，将第一个事件侦听器保留在原处。
我知道每次scrollPosition改变时useEffect都在渲染，我的目标是阻止scrollPosition在第一次滚动后发生本质上的改变。
这里的问题（除了任何性能问题之外）是有些组件具有动画，每次scrollPosition更改时动画都会重置。
我的问题是：* * 如何在useEffect第一次运行scrollPosition更改后停止渲染？**

function App() {

  const [scrollPosition, setScrollPosition] = useState(0);
  const [animating, setAnimating] = useState(false);

  const handleScroll = () => {
    const position = window.scrollY;
    setScrollPosition(position);
  };

  function animator() {
    if (!animating) {
      window.addEventListener('scroll', handleScroll, { passive: true });
    }

    return () => {
        window.removeEventListener('scroll', handleScroll);
     };
   }

  useEffect(() => {
    animator();
  }, [scrollPosition]);
}

我试过将事件侦听器移动到基本上所有可能的其他位置，创建新函数来处理它，并使用animating布尔值来尝试防止scrollPosition发生变化，但唉，它还没有为我工作。