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 has a missing dependency: 'props'. Either include it or remove the dependency array. However, 'props' will change when any prop changes, so the preferred fix is to destructure the 'props' object outside of the useEffect call and refer to those specific props inside 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

函数将始终在渲染调用之间发生变化。

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

React Hooks : fetch data inside useEffect warning

javascript

reactjs

redux

react-hooks