Как получить все данные из GitLab API с помощью Axios?

Question

Я хочу получить данные из всех проектов, размещенных на моем экземпляре GitLab.Теперь я знаю, что GitLab отображает 20 проектов по умолчанию, поэтому мне нужно установить большее количество экземпляров, отображаемых на странице:

https://gitlab-repo.com/api/v4/projects?per_page=100

Поэтому он приводит к соответствующему коду аксиоса:

const url='https://gitlab-repo.com/api/v4/projects?per_page=100'
const vm = new Vue({
el: "#app",
data: {
    results: [],
    loading: true,
    errored: false
},
mounted() {
    axios
        .get(url)
        .then(response => (this.results = response.data))
        .catch(error => {
            console.log(error)
            this.errored = true
        })
        .finally(() => this.loading = false)
}
}) 

Дело в том, что максимальное количество проектов, которые GitLab может отображать на странице, равно 100, и у меня больше проектов, чем это.

Я думал о том, чтобы наложить условие на количество экземпляров (проектов) в разделе params функции get в axios, но не могу понять, как это записать.

Как мне указатьв моем запросе axios, что если число проектов превышает 100, я хочу загрузить данные, которые находятся на следующей странице (ах)?

Answer 1

Сначала вы захотите написать функцию, которая запрашивает определенную страницу, что-то вроде этого:

function getPage(page) {
  let url = `https://gitlab-repo.com/api/v4/projects?per_page=100&page=${page}`;
  return axios
        .get(url)
        .then(response => (response.data))
}

Если у вас есть async/await в вашей среде, я бы тогда сделал что-то вроде этого,продолжать запрашивать следующую страницу, пока вы не получите результат, который <100 результатов </p>

let resultCount = 100;
let results = [];
let page = 1;
while (resultCount === 100) {
  let newResults = await getPage(page);
  page++;
  resultCount = newResults.length;
  results = results.concat(newResults);
}