小编Dav*_*wii的帖子

我正在深入研究 React。但useEffect React hook 仍然让我感到困惑。我知道我可以将依赖项作为数组传递给它来控制组件的渲染。我已经使用了 props 和 local state 来做到这一点并且它有效。

让我仍然感到困惑的是，当我将 redux reducer 作为依赖项传递时。它会导致渲染组件的无限循环。

用户组件

const usersComp = () => {
    const users = useSelector(state => state.users);

    useEffect(
        // Fetch users and update users state
        useDispatch().dispatch(getUsers)
    ,[users]) // <-- Causes an infinite loop!!

    if(users.length){
        return( users.map(user => <p>{user}</p>))
    }
}

getUsers Redux Thunk 函数

export async function getUsers(dispatch, getState) {
    fetch(endpoint)
        .then(response => response.json())
        .then(users => {
            dispatch({type: GET_USERS, payload: users})
        }).catch(err => console.error("Error: ", err));
}

用户 …