如何循环 Axios 请求来填充对象数组？
我正在尝试创建一个使用名为 swapi 的 Star Wars API 的 Web 界面。可以通过此链接访问它:https://swapi.co/
我可以搜索人物、星际飞船、行星、物种和电影。因此，例如，如果我想搜索 Luke Skywalker，我会添加 /api/people/1/，例如 https://swapi.co/api/people/1/ .
到目前为止一切顺利。
现在，如果我想要每个星球大战角色，我只需删除数字 1，网址将为 https://swapi.co/api/people/ 我将拥有前十个我想是 87 个中的字符。
但我不想要 10 个。我想要所有这些......这让我需要执行多个请求来获取所有字符数据。问题是，如果我使用循环来发出请求，比如说 while 循环，它会在第一个请求将数据带到我的代码中进行处理之前完成所有搜索。
我正在通过 Redux 使用全局状态，并通过 componentDidMount() 调用 Redux Thunk。它工作正常，实际上，前十个字符数据被检索，它们填充了我在 React 中的渲染方法。但是，我如何才能发出多个请求而不会在这些请求之前结束循环呢？
最佳答案
如果我使用 async/await 正确回答了您的问题，这就是我的解决方案:
getCharacter = async i => {
let { characters } = this.state;
let res = await axios.get(`https://swapi.co/api/people/${i}/`);
characters.push(res);
this.setState({ characters });
return res;
};
componentDidMount() {
// ids = [1, 2, 3, ..., 10]
let ids = Array.from({length: 10}, (v, k) => k+1)
Promise.all(ids.map(id => this.getCharacter(id)))
}
这是codesandbox中的完整代码: https://codesandbox.io/embed/axios-react-ojpew?fontsize=14
关于json - 如何使用 Axios 通过 React 发出循环请求？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56550914/