promise.all 与 forEach答案

【问题标题】：promise.all with forEachpromise.all 与 forEach
【发布时间】：2018-10-30 23:47:50
【问题描述】：

我已经编辑了这个问题。更改为语法错误，它仍然无法正常工作。我正在使用 github api 获取用户列表，然后为每个用户获取他的 repos。我的想法是获取所有 repos（我得到了），当一切都完成后，将 allRepos 数组放入用户对象中，然后返回用户对象以便我可以渲染它。我已经通过 Promise.all 中的 foreach 循环完成了它。我知道我没有正确使用它，因为我不能在 Promise.all 之后使用 .then()。是否可以按我需要的方式使用 Promise.all，还是必须提前定义要放入的数组？帮助将不胜感激。

function onGetUsers() {
    // var prmUsers=getUsers()
    getUsers()
    .then(getrepos)
    .then(data=> console.log(data))//here i want to render the object

}
function getrepos(users){
    var usersObj={
        users: users,
    }
    var allRepos = []
        Promise.all(users.forEach(user => {
            var currUser = axios.get(user.repos_url)
                .then(data => allRepos.push(data)); 
            return currUser;
        })).then('here i want to put allRepos in the usersObj')
    return usersObj
    
}
function getUsers() {
    var prmRes = axios.get('https://api.github.com/users');
    var prmUsers = prmRes.then(res => {
        return res.data;
    });
    return prmUsers;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/index.css">
    <title>Github Users</title>
</head>
<body>
    <button onclick="onGetUsers()">Get Users</button>
    <script src="lib/axios.js"></script>
    <script src="js/index.js"></script>
</body>
</html>

【问题讨论】：

How do I return the response from an asynchronous call?的可能重复
做 Promise.all([p1, p2, p3]).then() 而不是 Promise.all[].then(
我投票结束，因为您的问题是语法错误（Promise.all 是一种方法，所以应该用括号调用，正如@NinjaJami 所说）。
你也可以试试 Promise.all(users.map(user => { return function () { axios.get(user.repos_url) } })).then((response)=> { //response 将是数组 allRepos=response; });

标签： javascript promise axios es6-promise

【解决方案1】：

function getrepos(users){
   let p = Promise.resolve(true);
    users.map(user => {
      p = p.then(() => axios.get(user.repos_url).then(userRepos => user.repos = userRepos));
    });
    return p.then(() => users);

}

使用此方法，您将获得 users 对象，其中每个用户都将拥有由他们的 repos 组成的 repos 属性。你只需要用这个替换你的一种方法。最后，您可以遍历它们并将所有存储库合并到一个数组中。

【讨论】：

【解决方案2】：

单击按钮并等待请求完成

function onGetUsers() {
// var prmUsers=getUsers()
getUsers()
    .then(getrepos)
    .then(data=> {
  console.log(JSON.stringify(data));
})

}
function getrepos(users){
const userPromises = users.map(user => {
  return axios.get(user.repos_url).then(userRepos => user.repos = userRepos);
});
return Promise.all(userPromises)
} 
function getUsers() {
  
var prmRes = axios.get('https://api.github.com/users');
var prmUsers = prmRes.then(res => {
  
    return res.data;
});
return prmUsers;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/index.css">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>
    <script src="js/index.js"></script>
    <title>Github Users</title>
</head>
<body>
    <button onclick="onGetUsers()">Get Users</button>
   
</body>
</html>

【讨论】：