承诺与forEach

时间:2018-10-30 15:01:23

标签: javascript promise axios es6-promise

我已经编辑了问题。更改为语法错误,但仍然无法正常工作。 我正在使用github api获取用户列表,然后为每个用户获取他的存储库。我的想法是获取所有存储库(完成后),然后将allRepos数组放入用户对象中,然后返回用户对象以便渲染它。 我已经通过Promise.all内部的foreach循环完成了此操作。我知道我没有正确使用它,因为在Promise.all之后不能使用.then()。 是否可以按照我需要的方式使用Promise。,还是必须事先定义要放入的数组? 帮助将不胜感激。

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>

2 个答案:

答案 0 :(得分:0)

sys.path

使用此方法,您将获得users对象,其中每个用户将具有由其回购构成的repos属性。您只需要用此方法替换一种方法即可。最后,您可以遍历它们,并将所有存储库也合并为一个阵列。

答案 1 :(得分:0)

点击按钮,等待请求完成

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>