Eslint 报错 React Hook useEffect has a missing dependency

刚开始这个问题让我挺懵逼的，举个例子

useEffect(() => {
	getUserInfo();
}, [])

我可能因为某些状态的变化导致需要重新请求最新数据，但是我并不想加入 getUserInfo 作为依赖。

而且这个是 eslint 的错误， react 是允许不用 getUserInfo 不作为依赖的。

还有一个问题是，这样会陷入无限循环

于是我百度了一下

stackoverflow.com/questions/5…

提供了几个办法解决这个问题

1. 如果外部不用，直接移动到 useEffect 里面

useEffect(() => {
  function getUserInfo() {
    ...
  }
  getUserInfo()
}, [])

2. useCallback.

const getUserInfo = useCallback(() => {...}, [])
useEffect(() => {
  getUserInfo()
}, [getUserInfo])

3. Function's default argument

useEffect((getUserInfo = getUserInfo) => {
   getUserInfo();
}, []);

4. Create a custom hook

这个方法有些复杂..

5. Disable eslint's warning

useEffect(() => {
  getUserInfo()
}, []) // eslint-disable-line react-hooks/exhaustive-deps

这应该是退一万步的做法。