Combine api get on HandleSubmit in React Js



我正在使用 axios get in a react App。

此网址返回结果:

/api/search/occupation/Doctor

这也返回结果

/api/search/gender/male

如何将两者结合起来

这是我的句柄提交:

import React, { Component } from 'react'
import { get } from 'axios'
...
...

  handleSubmit(event) {
event.preventDefault()
get(`/api/search/gender/${this.state.formValues.gender}`)
.then((res) => {
  console.log(res.data)
  if (res.status === 200) {
    this.setState({
      data: res.data
    })
  }
})

}

更新

我试图得到一个回复,但收到裁判错误

      handleSubmit(event) {
    event.preventDefault()
    axios.all([
      axios.get(`/api/search/gender/${this.state.formValues.gender}`),
      axios.get(`/api/search/occupation/${this.state.formValues.occupation}`)
    ])
    .then(axios.spread(function (gender, religion) {
      var genderData = gender.data || []
      var occupationData = occupation.data || []
      var userData = genderData.concat(occupationData)
      that.setState({ userData: userData })
    }))
    .catch(error => console.log(error))
  }

您可以并行发送这两个请求,然后在两个请求都得到解决后更新状态。

handleSubmit(event) {
 const promise1= axios.get('api1');
 const promise2= axios.get('api2');
 Promise.all([promise1, promise2]).then(response => {
   // Update the state using response[0] and response[1]
 })
}

另请注意,如果第二个 API 请求依赖于第一个 API 请求的响应,则不能使用Promise.all

最新更新