0

我对 React 很陌生，遇到了 useReducer。如果我在这里粘贴我的代码会很长，因为它涉及到组件，useContext和useReducer。所以我将只粘贴一些代码。我对 try and catch 循环中的状态有疑问。我的 reducer 启动了一个使用 firebase signInWithEmailAndPassword() 的登录方法。我做错了 try and catch 循环吗？我可以在 console.log 中看到错误消息，但我的状态不会随着错误消息而更新，无论是在 then().catch() 还是在 try and catch 循环中。

  const loginUser = (usename, password, state) => {
    try{

      const res = auth.signInWithEmailAndPassword(email, password).then( user => {
          return {...state, userid: user.uid}
        }).catch(error => {
              return {...state, error: error.message}
        })


    }catch (error) {
      console.log("oops !! error: ", error);
   
      return {...state, error: error, isLoggedIn:false, isLoading:false};
    }
}

export const storeReducer = (state, action) => {
    switch (action.type) {
      case USER_LOGIN: 
      
        return loginUser(action.username, action.password, state);
          
      default:
        return state;
    }
  };

上面的代码是一个简化版本，我在使用 useReducer 更新状态时遇到了问题。

4

1 回答 1

0

我会将您的loginUser功能更改为这样的...

const loginUser = async (usename, password, state) => {
    try{
      const response = await auth.signInWithEmailAndPassword(email, password)

      return // return user here
    }catch (error) {
      console.log("oops !! error: ", error);
   
      return // return error here
    }
}

你应该根据这个函数的返回来分派一个动作，或者从这个函数中分派。你不应该把这个函数放在你的减速器中，因为它是异步的，你的减速器应该是一个纯函数

应该更像...

loginUser.then(data => {
  // dispatch accordingly
})
于 2020-09-24T17:15:46.510 回答