React+TypeScript setInterval Hook 周期调用

对setInterval进行Hook封装，这将很有用，在实现倒计时Hook的时候可以引用，详见我的另一篇笔记 juejin.cn/post/700621…

import { useEffect, useRef } from 'react'

/**
 * interTerval hooks组件
 * @param fn 执行函数
 * @param delay 时间
 * @param options immediate为true时，先立即执行一次fn函数后再执行定时器
 */
function useInterval(
  fn: () => void,
  delay: number | null | undefined,
  options?: {
    immediate?: boolean
  }
): void {
  const immediate = options?.immediate
  const timerRef = useRef<() => void>()

  timerRef.current = fn

  useEffect(() => {
    if (delay === undefined || delay === null) {
      return
    }
    if (immediate) {
      timerRef.current?.()
    }
    const timer = setInterval(() => {
      timerRef.current?.()
    }, delay)
    return () => {
      clearInterval(timer)
    }
  }, [delay])
}

export default useInterval