Javascript 在同一函数中进行两次调用

我有两个请求，一个GET请求和一个POST请求，我获取GET请求并在和数组中设置响应状态，我想将这个数组传递给POST请求主体，然后获取POST请求以便我可以进行调用，问题是它没有在GET调用中设置状态，并且总是返回未定义的，我不明白为什么，下面是代码：

我的构造函数：

constructor(props){
  super(props);
  this.state = {
    info: [],
  }
}

myFunction = async () => {
  fetch("https://myapp.com/info", {
    method: "GET",
    headers: {
      "Content-Type": "application/json",
      "x-auth-token": token
    }
  })
    .then(res => res.json())
    .then(response => {
      this.setState({ info: response });
      fetch("https://myapp.com/submit_info", {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          "x-auth-token": token
        },
        body: JSON.stringify({
          infoID: this.state.info.id
        })
      })
        .then(res => res.json())
        .then(result => {
          console.log(result);
        });
    })
    .catch(error => console.log(error));
};

功能：

constructor(props){
  super(props);
  this.state = {
    info: [],
  }
}

myFunction = async () => {
  fetch("https://myapp.com/info", {
    method: "GET",
    headers: {
      "Content-Type": "application/json",
      "x-auth-token": token
    }
  })
    .then(res => res.json())
    .then(response => {
      this.setState({ info: response });
      fetch("https://myapp.com/submit_info", {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          "x-auth-token": token
        },
        body: JSON.stringify({
          infoID: this.state.info.id
        })
      })
        .then(res => res.json())
        .then(result => {
          console.log(result);
        });
    })
    .catch(error => console.log(error));
};

---

您忘记返回承诺，然后使用

response

对象设置

infoID

字段，而不是导致调用

的状态。setState

是异步的，在进行第二次api调用时仍将挂起

myFunction = () => {
  fetch("https://myapp.com/info", {
    method: "GET",
    headers: {
      "Content-Type": "application/json",
      "x-auth-token": token
    }
  })
    .then(res => res.json())
    .then(response => {
      this.setState({ info: response }); // async call
      return fetch("https://myapp.com/submit_info", {
        // return promise for chaining
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          "x-auth-token": token
        },
        body: JSON.stringify({
          infoID: response.id
        })
      })
        .then(res => res.json())
        .then(result => {
          console.log(result);
        });
    })
    .catch(error => console.log(error));
};

---

您忘记返回承诺，然后使用

response

对象设置

infoID

字段，而不是导致调用

的状态。setState

是异步的，在进行第二次api调用时仍将挂起

myFunction = () => {
  fetch("https://myapp.com/info", {
    method: "GET",
    headers: {
      "Content-Type": "application/json",
      "x-auth-token": token
    }
  })
    .then(res => res.json())
    .then(response => {
      this.setState({ info: response }); // async call
      return fetch("https://myapp.com/submit_info", {
        // return promise for chaining
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          "x-auth-token": token
        },
        body: JSON.stringify({
          infoID: response.id
        })
      })
        .then(res => res.json())
        .then(result => {
          console.log(result);
        });
    })
    .catch(error => console.log(error));
};

---

React的调用也是异步的。您应该只使用

GET

请求的数组结果作为

POST

请求的输入。我认为没有必要在下一个请求之前先将其保存为state。请查看React中setState的文档。它是异步的，因此需要像

this.setState（{info:response}，（）=>{…second fetch here}）这样的回调。

React的调用也是异步的。您应该只使用

GET

请求的数组结果作为

POST

请求的输入。我认为没有必要在下一个请求之前先将其保存为state。请查看React中setState的文档。它是异步的，因此需要像

this.setState（{info:response}，（）=>{…second fetch here}）这样的回调

您应该添加一条注释，说明在此处设置react state对第二个请求没有影响。是的，这就是我建议使用第一个api调用的响应对象而不是状态的原因。您应该添加一条注释，说明在此处设置react state对第二个请求没有影响。是的，这就是我建议使用的响应对象的原因第一个api调用，而不是状态。