React Hooks：在useEffect警告中获取数据

Question

我正在使用 react Hooks useEffect 从组件中的 API 获取数据

props.getUserInfoAction() is an Action from redux dispatching user info 

示例

useEffect(() => {
        props.getUserInfoAction();
      }, []);

效果很好，我可以获取我的数据，但我发现我的控制台中显示了 warning。

React Hook useEffect 缺少一个依赖项：'props'。要么包括 它或删除依赖数组。但是，“道具”会改变 any 道具发生变化，因此首选的解决方法是在 useEffect 调用之外解构“道具”对象并引用那些特定的道具 内部 useEffect react-hooks/exhaustive-deps

我尝试在数组中传递 props，但这样做我得到了 API 调用的无限循环。

useEffect(() => {
            props.getUserInfoAction();
          }, [props]); 

Answer 1

如果props.getUserInfoAction() 是您应该执行的操作，而不是已经通过调度接收（我假设来自connect），请执行以下操作：

import {getuserInfoAction} from './actionCreators'
import {useDispatch} from 'react-redux'

const Comp = () =>{
    const dispatch = useDispatch()

    useEffect(() =>{
        dispatch(getUserInfoAction())
    },[dispatch])
}

因为即使你这样做：

const {action} = props

函数在渲染调用之间总是会发生变化。