Question

TypeError：无法读取 React js 中未定义的属性“type”

2020-07-29

2403

javascript reactjs redux

我正在使用 jumbo 4.1.1 模板。我得到了响应，但出现了此错误。我的代码如下： authAction.js:

...
export const userSignIn = (user) => {
// const {email, password} = user;
console.log(user)
axios.post(base_url +'login', user)
.then(response=> {
    console.log(response.data)
    return {
        type: SIGNIN_USER,
        payload: user
    };
})    
};

但是当我运行项目时，出现了错误 TypeError: Cannot read property 'type' of undefined

Answer 1

我相信那是因为你没有正确地分派动作。

你使用 thunk 了吗？

如果你使用 Redux 并进行异步调用，则应该返回 dispatch。

const userSignup = (signupData) => {
  return async (dispatch) => {
    try {
      let res = await axios.post(`${url}/user/`, { user: signupData });
      dispatch({
        type: "FETCH_CURRENT_USER_SUCCESS",
        payload: res.data.user,
      });

      return true;
    } catch (error) {
      console.log(
        "%c CATCH in userSignup ",
        "background: red; color: #bada55",
        error
      );
    }
  };
};

请注意，我在第二行返回了一个以 dispatch 作为参数的函数。然后使用 dispatch （第 4 行）分派动作的类型和有效负载。

此外，我最后从函数 userSignUp 返回了一些内容，因此函数 userSignUp 的调用者会得到一些响应。

如果您不理解上述任何内容，请告诉我。

Answer 2

您可以从此处使用 async + await 中受益。

例如：

export const userSignIn = async (user) => {
    try {
        // const {email, password} = user;
        console.log(user);
        const data = await axios.post(base_url +'login', user);     
        console.log(data);
        return {
            type: SIGNIN_USER,
            payload: user,
        }; 
    } catch (error) {
        console.log(error);
        // return an error action...?
        return {
            type: ERROR,
            payload: error,
        };
    }
};