【React hooks】获取上一轮的state或props

场景： 在用hooks重构我的组件FetchTable时，我需要在引用对象query改变时重新获取数据，大概如此：

/** query:{a:1,b:2} */
useEffect(() => {
    // if (preQuery !== query ) DO STH...
  }, [query])

但由于引用对象每次比较都会返回false ，因此会造成重复的渲染，甚至陷入死循环

因此面对这种情况，需要获取上一轮的props，使用loadsh提供的isEqual或其他工具库函数进行深比较。

官方给出的方法是自己封装一个usePrevious 钩子 ：

function Counter() {
  const [count, setCount] = useState(0);
  const prevCount = usePrevious(count);
  return <h1>Now: {count}, before: {prevCount}</h1>;
}

function usePrevious(value) {
  const ref = useRef();
  useEffect(() => {
    ref.current = value;
  });
  return ref.current;
}

const usePrevious = (value: any) => {
    const ref = useRef()
    useEffect(() => {
      ref.current = value
    })
    return ref.current
  }

  const preQuery = usePrevious(query)

  useEffect(() => {
    if (isEqual(preQuery, query)) return
    handleData()
  }, [query])

参考stackoverflow：react useEffect comparing objects