NextJS编译出现如下错误,原因是在使用useEffect时,当我们将函数的声明放在useEffect函数外面时
或者使用useState定义的历史变量,会报警告
Warning: React Hook useEffect has a missing dependency
解决方法:
1、逐个添加注释忽略警告
useEffect(() => {test()// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
2、将变量和函数内容移到useEffect内
useEffect(() => {...函数逻辑
}, []);
3、全局忽略,.eslintrc.json中增加如下配置
{"extends": "next/core-web-vitals","rules": { "react-hooks/exhaustive-deps": 0}
}
4、使用useCallback(推荐)
useEffect(() => {test()
}, []);const [currItemCode, setCurrItemCode]:[string, any] = React.useState("")const test = useCallback(() => {..函数内容
}, [currItemCode])