javascript - 从第一个 api 获取数据后进行第二次 api 调用

Question

我有第一个 API 调用，它为我获取了一些数据，一旦我从这个 api 获取了数据，我就需要进行第二个 api 调用。它必须连续发生，而不是并行发生。我们如何在 React ComponentDidMount 中做到这一点？ 我正在听 firebase 。 让我们假设第一个 api 为我提供了一个 matchId，现在我们需要使用这个 matchid 在第一个 api 调用之后进行第二次调用，而无需任何点击。

假设这是我的第一次 Firebase 调用。

const cardsListener = 
        getDATA()
        .onSnapshot( (doc)=>{
            console.log("doc is ",doc);
            let data = doc.data();
            console.log("data",data);
            this.setState({
                 datainstate:data
            });
        });

Answer 1

感谢 async/await，您可以等待操作完成。

componentDidMount() {
  this.firstApiCall()    
}

async firstApiCall() {
  await fetch("http://myurl.com", {
     method: 'POST',
     body: JSON.stringify(data), // data can be `string` or {object}!
     headers:{
       'Content-Type': 'application/json'
     }
   })
   .then(res => res.json())
   .then((responseJson) => {
     //if it worked
     this.secondApiCall()
   })
   .catch(error => console.error('Error:', error))
}

secondApiCall() {

}