react-native axios解决了未执行的回调函数

时间:2017-05-28 12:36:30

标签: javascript react-native promise xmlhttprequest axios

我想在使用axios发出请求后设置一个回调函数。 这段代码有效。

onButtonPress(){
this.setState({ status: null, loading: true });

axios.post(url, {
    'email': this.state.email,
    'password': this.state.password
})
.then(response => {
  this.setState({
    email: '',
    password: '',
    status: 'Authentication Successful',
    loading: false
  })
})
.catch(this.onLoginFail.bind(this))
}

但是当将回调分配给这样的单独函数时,该函数不会解析promise

onButtonPress(){
this.setState({ status: null, loading: true });

axios.post(url, {
    'email': this.state.email,
    'password': this.state.password
})
.then(response => {
  this.onLoginSuccess.bind(this)
})
.catch(this.onLoginFail.bind(this))
}

onLoginSuccess(){
  this.setState({
    email: '',
    password: '',
    status: 'Authentication Successful',
    loading: false
  })
}

我如何解决第二块代码的承诺?

2 个答案:

答案 0 :(得分:0)

您在第二个示例中尝试执行的操作是您只是将函数绑定到此实例,而不是进行调用。而不是在函数内部将函数绑定到此实例是一种不好的做法。它将绑定函数触发的时间,而不是在执行一次的构造函数中执行此操作。然后将函数传递给axios解析并拒绝(然后捕获)作为回调。

constructor(props) {
    super(props);
    this.onLoginSuccess=this.onLoginSuccess.bind(this);
    this.onLoginFail=this.onLoginFail.bind(this);
    this.onButtonPress=this.onButtonPress.bind(this);
} 

onButtonPress(){
     this.setState({ status: null, loading: true }, ()=> {
         axios.post(url, {
             'email': this.state.email,
             'password': this.state.password
         })
         .then(this.onLoginSuccess)
         .catch(this.onLoginFail);
     });
}

onLoginSuccess(){
    this.setState({
        email: '',
        password: '',
        status: 'Authentication Successful',
        loading: false
    })
}

答案 1 :(得分:0)

就我而言,一切正常

  axios.post(Urls.UploadImage, bodyFormData, {
    headers: {
      "Content-Type": "multipart/form-data",
      Authorization: "Bearer Token" 
    }
  })
  .then((response) => this.onUploadSuccess(response))
  .catch((error) => this.onUploadError(error));


 onUploadSuccess(response){
 }

 onUploadError(error){
 }