react hooks相关

1.有些时候我们监听数据变化的时候不希望拿到第一次初始化的数据,这时候我们就需要额外加一个计数器,当它大于1的时候才去监听

const useUpdate = (dep: boolean, fn: () => void) => {
  const [count, setCount] = useState(0)
  useEffect(() => {
    setCount(x => x + 1)
  }, [dep])
  useEffect(() => {
    if (count > 1) {
      fn()
    }
  }, [count])
}

使用useRef来优化

const useUpdate = (dep: boolean, fn: () => void) => {
  const isFirst = useRef(true)
  useEffect(() => {
    if (isFirst.current) {
      isFirst.current = false;
      return
    }
    fn()
  }, [dep])
}

上面的dep就是我们依赖的数据,fn就是我们数据变化后需要作出的修改

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容