Javascript 如何在异步函数循环后设置状态

我能找到的最接近的答案是，这没有帮助，因为我需要设置状态：

我认为答案应该很简单，但我对Javascript还是相当陌生的。拉取所有配置文件后，我试图将

isLoading

的设置状态移动到

componentDidMount() {
    console.log('MatchesScreen init props: ', Object.keys(this.props))

    Object.keys(this.props.profile.profile.matches).map((username) => {
      console.log('match', username)
      url = 'https://xxxxxxx.execute-api.us-west-2.amazonaws.com/prod/profile?username=' + username
      fetch(url, {
        method: 'GET',
      })
      .then((response) => response.json())
      .then((responseJson) => {
        this.setState({
          isLoading: false,
        })
        this.props.addMatch(responseJson)
      })
      .catch((error) =>{
        console.error(error);
      })
    })
  }

---

我尝试过各种方法，比如在map函数中添加

.then（）

，但到目前为止没有成功

尝试使用

异步

/

等待

模式，如下所示：

异步组件didmount（）{ ... Object.keys（this.props.profile.profile.matches）.map（（用户名）=>{ ... 等待获取（url{ ... 然后将您的

setState

方法移动到它自己的回调中，您可以在

中调用它。然后（）

语句跟随

fetch

---

我喜欢这个引用：

您可以在

.map（）

函数中返回每个承诺，这将给您留下一个承诺数组。一旦您得到了承诺，您可以使用

promise.all（）

等待数组中的所有承诺得到解决

componentDidMount() {
    console.log('MatchesScreen init props: ', Object.keys(this.props))

    // Put all promises into an array
    const promisesArray = Object.keys(this.props.profile.profile.matches).map((username) => {
        console.log('match', username)
        url = 'https://xxxxxxx.execute-api.us-west-2.amazonaws.com/prod/profile?username=' + username;
        // Return each promise
        return fetch(url, {
                method: 'GET',
            })
            .then((response) => response.json())
            .then((responseJson) => {
                this.props.addMatch(responseJson)
            })
            .catch((error) =>{
                console.error(error);
            });
    });

    // Wait for all promises in array to resolve
    Promise.all(promisesArray)
        .then(() => {
            // This will execute once all promises have resolved
            this.setState({
                isLoading: false,
            });
        })
        .catch(e => console.error(e));
}

---

尝试将

对象.keys（）

包装在while循环中，并在末尾使用if语句

var profilesMatched = 0;
while(profilesMatched < Object.keys(this.props.profile.profile.matches).length){
    Object.keys(this.props.profile.profile.matches).map((username) => {
      console.log('match', username)
      url = 'https://xxxxxxx.execute-api.us-west-2.amazonaws.com/prod/profile?username=' + username
      fetch(url, { method: 'GET', })
      .then((response) => {response.json()})
      .then((responseJson) => {
        this.props.addMatch(responseJson);
        profilesMatched++;
      })
      .catch((error) => {
        console.error(error);
      });
    });
    if(profilesMatched == Object.keys(this.props.profile.profile.matches).length){
        this.setState({
          isLoading: false,
        })
    }
}

var profilesMatched=0；
while（profilesMatched{
console.log（'match'，用户名）
url='1〕https://xxxxxxx.execute-api.us-west-2.amazonaws.com/prod/profile?username=“+用户名
获取（url，{method:'GET'，}）
.then（（response）=>{response.json（）}）
.然后（（responseJson）=>{
this.props.addMatch（responseJson）；
profilesMatched++；
})
.catch（（错误）=>{
控制台错误（error）；
});
});
if（profilesMatched==Object.keys（this.props.profile.profile.matches）.length）{
这是我的国家({
孤岛加载：false，
})
}
}