React post 来自 React 组件的请求

Question

我在 React Component 中有一个函数：

verifyInputAndRequest(){
    var formData = new FormData();
    formData.append("username", this.state.username);
    formData.append("password", this.state.password);
    var reply = performPostRequest("linkRequest/", formData)
    console.log(reply) //this returns undefined     
    }

}

和 performPostRequest 函数如下所示：

export function performPostRequest(RequestUrl, data) {
    axios.post(RequestUrl, data)
    .then(function (response) {
        return response;
    })
    .catch(function (error) {
        //handle error
          return error;
    });

}

在执行期间，reply 被记录为 undefined。

我理解这是由于同步执行。

如何处理？

Answer 1

export function performPostRequest(RequestUrl, data) {
 return new Promise((resolve,reject)=>{
  axios.post(RequestUrl, data)
  .then(function (response) {
    resolve (response);
   })
  .catch(function (error) {
    //handle error
      reject(error);
  });
})
}

并在验证函数中：-

   verifyInputAndRequest(){
    var formData = new FormData();
    formData.append("username", this.state.username);
    formData.append("password", this.state.password);
    performPostRequest("linkRequest/", formData)
     .then((data)=>{
       var reply = data;
       console.log(reply);
      })
     .catch((err)=>{
      console.log("err",err);
     })

    }

}

React post 来自 React 组件的请求

React post request from react component

asynchronous

async-await

reactjs

axios