无法捕获带有axios的分页API的响应

Question

我正在尝试使用递归函数来使用端点，但我无法获取最终数据。如果我用这个：

let b0 = []
const paginatedAPI = (uri, arr) => {
  axios.get(uri)
  .then(resp => {
    //console.log(resp.data.info.next)
    arr = [...arr,...resp.data.results]
    //console.log(arr)
    if(resp.data.info.next){
      paginatedAPI(resp.data.info.next,arr)
    }
    return arr
  })
  .catch(error => console.log(error))
  return arr
}

b0 = paginatedAPI('https://rickandmortyapi.com/api/character',b0)

并取消注释日志记录语句很明显，数组正在被正确填充，但当我在开发工具中评估它时，它当然是空的。我首先尝试使用此代码运行正常，但似乎错了：

axios.get('https://rickandmortyapi.com/api/character')
.then(response => {
  console.log(response)
  let numPages = response.data.info.pages
  a0 = [...response.data.results]
  for(let i = 2;i <= numPages;i++){
    axios.get(`https://rickandmortyapi.com/api/character?page=${i}`)
    .then(resp => populateDropDown(a0 = [...a0,...resp.data.results]))
  }
})
.catch(data => {
  const htmlStr = '<div class="text-danger">We\'re sorry, but an unexpected error occurred</div>';
  $('.container').append(htmlStr);
});

我已经尝试使用谷歌搜索一个完全没有运气但迄今没有运气的解决方案。谢谢。

Answer 1

在进一步研究并查看Promises和async / await之后，我仍然觉得我只需要在某处捕获数据，所以我最终尝试了这个：

let b0 = []

const paginatedAPI = (uri, arr) => {
   axios.get(uri)
  .then(resp => {
    arr = [...arr,...resp.data.results]
    if(resp.data.info.next){
      paginatedAPI(resp.data.info.next,arr)
    }
    b0 = arr
  })
  .catch(error => console.log(error))
}

paginatedAPI('https://rickandmortyapi.com/api/character',b0)

它的工作原理！谢谢