如何将我的方法重写为异步/等待？

Question

In my react app I'm making a post request to the server with the help of axios:

 onSubmit = (results) => {
     axios.post("http://localhost:8080/simulate/", results)
      .then( (response) => this.setState({results: response.data.results}))
      .catch( (error) => this.setState({results: error.response.data, hasError: true})
      ); 
  }

How can I rewrite this method to async/await ?

Answer 1

onSubmit = async (results) => {
  try {
    const response = await axios.post("http://localhost:8080/simulate/", results)
    this.setState({results: response.data.results})
  } catch (error) {
    this.setState({results: error.response.data, hasError: true})
  }
}

Edit - without Axios

If you don't want to use Axios, you may use the fetch api :

onSubmit = async (results) => {
  try {
    const response = await fetch("http://localhost:8080/simulate/", {
      method: 'POST',
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify(results)
    })
    const { data } = await response.json()
    this.setState({results: data.results})
  } catch (error) {
    this.setState({results: error.response.data, hasError: true})
  }
}