axios promise在"axios.all"中返回正确的值.函数，但在“然后"中未定义功能 [英] axios promise returns correct value in "axios.all" function, but is undefined in the "then" function

问题描述

我正在关注一个教程，该教程中要求从git API中获取数据，并且评分算法将对该数据进行排序.

I'm following a tutorial in which data from the git API is requested and a scoring algorithm will order that data.

战斗功能将包含两个元素的数组，即两个github用户.我们通过getUserData方法检索个人资料并为eah用户评分

The battle function will take an array of two elements, i.e two github users. We retrieve the profile and score for eah user from the getUserData method

module.exports = {
  battle: function(players) {
      return axios.all(players.map(getUserData))
        .then(response => {
           response.forEach( each=>console.log(each));
           return response;
       })
  }
}

getProfile和getRepos函数可以正确地检索具有用户配置文件(用户名，关注者等)及其存储库(存储库名称等)上的数据的对象.因此，我已经省略了这两个函数的代码，因为我已经知道它们一定可以工作.此外，calculateScore方法也可以正常工作，并按预期返回输出.

The getProfile and getRepos functions ork correctly in retrieving objects which have data on the users profile(username, followers, etc) and their repos(repo names, etc.). So I've omitted the code for both these functions as I already know they work for certain. Additionally, the calculateScore method also works and returns output as expected.

console.log语句显示正确创建了具有键"profile"和"score"的对象，并按预期方式打印了配置文件对象数据和得分.到目前为止一切顺利.

The console.log statement shows that the object with keys "profile" and "score" is correctly made, and prints out both the profile object data and the score as expected. So far so good.

function getUserData(player) {
  axios.all([
    getProfile(player),
    getRepos(player)
  ])
    .then(function(data) {
        var profile = data[0];
        var repos = data[1];

        console.log({
            profile: profile,
            score: calculateScore(profile, repos)
        })

        return {
            profile: profile,
            score: calculateScore(profile, repos)
        }
    })
}

问题:

战斗"中的回调函数应接收大小为2的数组，每个元素均包含该特定玩家的个人资料和得分.例如:

The callback function in "battle" should receive an array of size 2, with each element containing the profile and score for that particular player. e.g:

[
 {
   profile: {profile data for player1...}
   score: 10 //or whatever the score is
 },
 {
   profile: {profile data for player2...}
   score: 2 //or whatever the score is
 }
]

但是回调函数从axios.all函数接收到[undefined，undefined]作为其输入

but instead the callback function is receiving [undefined, undefined] as its input from the axios.all function

如果我错了，请更正我，但是在诺言中，"axios.all"方法的输出不是应该作为"then"方法的输入.那么，如果console.log语句显示axios.all输出的数据正确，为什么我会变得不确定?

Correct me if I'm wrong, but in promises, isn't the output from the "axios.all" method supposed to be the input for the "then" method. So why am I getting undefined if the console.log statement shows that axios.all is outputting the correct data?

推荐答案

您的 getUserData 函数不返回任何内容.如下更改:

Your getUserData function does not return anything. Change it as below:

function getUserData(player) {
  return axios.all([
  // ...
  ]);
}

---

该行为是因为在执行 response.map 时，您返回了一个 undefined 值数组，在其中用 undefined 替换了所有项目( console.log 返回 undefined ).

---

That behaviour is because you return an array of undefined values when you do response.map where you replace all the items with undefined (console.log returns undefined).

相反，返回异步调用的实际结果:

Instead, return the actual result from the asynchronous call:

module.exports = {
  battle: function(players) {
      return axios.all(players.map(getUserData))
        .then(response => {
            response.forEach(each => console.log(each));
            return response;
        });
  }
}

这篇关于axios promise在"axios.all"中返回正确的值.函数，但在“然后"中未定义功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！