使用间隔

useInterval来自Dan Abramov 的这篇博文（2019 年）：

function useInterval(callback, delay) {
  const savedCallback = useRef();

  // Remember the latest callback.
  useEffect(() => {
    savedCallback.current = callback;
  }, [callback]);

  // Set up the interval.
  useEffect(() => {
    function tick() {
      savedCallback.current();
    }
    if (delay !== null) {
      let id = setInterval(tick, delay);
      return () => clearInterval(id);
    }
  }, [delay]);
}

一个潜在的错误

可以在提交阶段和调用之间调用间隔回调useEffect，从而导致调用旧的（因此不是最新的）回调。换句话说，这可能是执行顺序：

1. 渲染阶段- 的新值callback。
2. 提交阶段- 提交给 DOM 的状态。
3. 使用布局效果
4. 间隔回调- using savedCallback.current()，与 …