Не удается получить ответ от разбитого на страницы API с помощью axios

Я пытаюсь использовать рекурсивную функцию для использования конечной точки, и у меня возникают проблемы с получением конечных данных. Если я использую это:

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

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

и раскомментируйте операторы ведения журнала, очевидно, что массив заполняется правильно, но, конечно, он пуст, когда я оцениваю его в инструментах разработчика. я сначала попытался запустить этот код, который отлично работает, но кажется неправильным:

axios.get('https://rickandmortyapi.com/api/character')
.then(response => {
  console.info(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);
});

Я пытался найти решение, которое является голым, но пока не повезло. Спасибо.