axios catch没有捕获错误

时间:2017-11-06 21:28:46

标签: reactjs redux axios

我正在使用merged = pd.merge(a, b, left_on = ['id'], right_on= ['ID'], how = 'inner').drop('ID', axis='columns') merged.to_csv(r'C:\things\output.csv', index=False) 以下代码:

axios 0.17.0

当用户注册验证未通过时,服务器设置为返回this.props.userSignupRequest(this.state) .then( res => { console.log(res.data) } ) .catch( err => { this.setState({ errors: err.response }) } ) 。这也显示在控制台中:400,但POST 400 (Bad Request)未被执行。这是为什么?我也试过了setState而没有。

2 个答案:

答案 0 :(得分:2)

可能会出现一些问题,我们可能需要查看更多代码才能确定。

Axios 0.17.0将在400响应状态上抛出错误。下面的演示显示了这一点。

意外行为可能是由setState()的异步行为引起的。如果您在致电console.log之后立即尝试setState()状态,那将无效。您需要使用setState回调。

const signinRequest = () => {
  return axios.post('https://httpbin.org/status/400');
}   
  
class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      errors: null
    }
  }
  
  handleSignin = () => {
    this.props.userSigninRequest()
      .then(result => {
        console.log(result.status);
      })
      .catch(error => {
        this.setState({
          errors: error.response.status
        }, () => {
          console.error(this.state.errors);
        });
      });
  }
  
  render() {
    return (
      <div>
         <button onClick={this.handleSignin}>Signin</button>
        {this.state.errors}
      </div>
    )
  }
}

ReactDOM.render(<App userSigninRequest={signinRequest} />, document.getElementById("app"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.17.0/axios.js"></script>

<div id="app"></div>

答案 1 :(得分:0)

POST 400 (Bad Request)不是错误,是一个不成功的回复。当请求出错时,catch会触发。

如果您想捕获400或类似的HTTP错误,则需要检查status

示例

this.props.userSignupRequest(this.state)
  .then( res => { console.log(res.status) } )
  .catch( err => { this.setState({ errors: err.response }) } )