reduxで非同期アクションからエラーをキャッチする方法はありますか？

Question

私がフェッチしている

、それがスローエラー：

fetchAuthorization(username, password) { 
    return fetch(`https://api.github.com/user`, { 
     method: 'GET', 
     headers: { 
      "Accept": 'application/json', 
      "Content-Type": 'application/json', 
      "Authorization": "Basic " + btoa(`${username}:${password}`) 
     }, 
    }) 
    .then(res => { 
     if(res.status !== 200) { 
      throw Error("Bad validation"); 
     } 
     return res.json(); 
    }); 
}, 

この非同期アクション（Reduxの）：

export const onSignInAction = (username, password) => { 
    return dispatch => { 
     return api.fetchAuthorization(username, password) 
      .then(res => { 
       dispatch(signInAction(username, password, res)); 
      }) 
      .catch(err => console.log(err)); 
    } 
} 

次：

handleSignIn = (username, password) => { 
    const { onSignInAction } = this.props; 
    onSignInAction(username, password); 
} 

そして今、私は私のフェッチからキャッチエラーをしたいです：

handleSignIn =() => { 
    const { onSignIn } = this.props; 
    const { errorMessage, open } = this.state; 
    const username = this.usernameField.getValue(); 
    const password = this.passwordField.getValue(); 
    try { 
     onSignIn(username, password); 
    } 
    catch (Error) { 
     this.setState({ 
      errorMessage: 'Incorrect username or password' 
     }); 
    } 
} 

正しくキャッチするには？私のコードはこのようなことはしません。ありがとう！

Answer 1

あなたは.catch()からthrowエラーができ、try..catch

var onSignInAction =() => { 
 
    return Promise.reject(new Error("Bad validation")).catch(e => { 
 
    console.log("catch 1", e.message); 
 
    throw e 
 
    }); 
 
} 
 

 
onSignInAction() 
 
.catch(err => { 
 
    console.log("catch 2:", { 
 
    errorMessage: 'Incorrect username or password' 
 
    }, err.message); 
 
});