为什么我应该从我的Axios调用中返回“未定义”，什么时候应该返回对象？

Question

问题简介：

在我的React应用程序中，我对Github进行了一些API调用，以获取一些用户数据。 在另一个函数中，我调用这些函数，并使用Axios的.all()方法等待它。

我想获取数据并使用.then()但返回的值只是一个未定义2倍的数组

预期会发生什么：

它应该返回给我2个玩家对象，并在对象的profile键中包含配置文件信息，并在对象的score键中包含得分值。

简而言之，我的应用程序在做什么？

它从2个用户名中获取数据，它们可以彼此“战斗”。 它只是获取分数和关注者并返回总和。 最后，它（应该）返回一个数组，其中包含2个玩家对象，这些对象已经排在首位（ exampleArray[0] ）。

一般信息是使用组件的React应用程序。 它实际上是一个非常小的组件，而辅助函数则在另一个文件中。

这是我调用自定义函数的地方（一个返回未定义的函数）：

componentDidMount() {
    const players = queryString.parse(this.props.location.search); //<== the usernames
    const playersArray = [players.playerOneName, players.playerTwoName];
    console.log(playersArray); // <== this logs the output as expected (an array with 2 usernames)

    battle(playersArray).then((data) => {   // <== the function it's all about
        console.log(data); // <== data is => [undefined, undefined];
    })
}

接下来是上面使用两个其他功能的战斗功能：

战斗

export function battle(players) { // <== players aray with 2 usernames as string
return axios.all(players.map(getUserData)) // <== look 1 function below
    .then(sortPlayers) // <== two functions below
    .catch(handleError)
}

getUserData

let getUserData = (player) => {
axios.all([
    getProfile(player),
    getRepos(player)
]).then((data) => {
    return {
        profile: data[0],
        score: calculateScore(data[0], data[1])
    }
})
}

sortPlayers

let sortPlayers = (players) => {

return players.sort((a, b) => {
    return b.score - a.score;
})
}

好的，因此它们还使用其他功能，但实际上并不太复杂。 让我知道您什么时候也需要其他小帮手的帮助。

我尝试将调试器放置在代码中的不同位置，并在控制台中记录了不同的内容，但是我无法通过（我第一次真正使用Promise）。 现在坐在这个小问题前面两个小时，我无法弄清楚。

我认为问题出在战斗功能本身或getUserData

在最后的屏幕快照中，console.log的输出如下所示： http : //prntscr.com/hz5abq

提前致谢

Answer 1

getUserData需要返回它创建的承诺。 此刻它什么都不返回，所以返回一个隐式的undefined，因此players.map(getUserData)导致[undefined, undefined]数组

即，执行以下操作：

let getUserData = (player) => {
    // VVV added return statement
    return axios.all([
        getProfile(player),
        getRepos(player)
    ]).then((data) => {
        return {
            profile: data[0],
            score: calculateScore(data[0], data[1])
        }
    })
}

Answer 2

getUserData中没有返回任何内容。 添加return或删除{}包装的axios.all

let getUserData = (player) => {

    return axios.all([
        getProfile(player),
        getRepos(player)
    ]).then((data) => {
        return {
            profile: data[0],
            score: calculateScore(data[0], data[1])
        }
    })

}