Первые 2 запроса проходят успешно, а начиная с 3-го всегда получаю сообщение undefined
Помогите понять в чем причина? Первые 2 запроса проходят успешно, а начиная с 3-го всегда идет undefined
В this.receptAll лежит следующее:
(20) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, __ob__: Observer]
0: {…}
1: {…}
2: {…}
3: {…}
4: {…}
5: {…}
6: {…}
7: {…}
8: {…}
9: {…}
10: {…}
11: {…}
12: {…}
13: {…}
14: {…}
15: {…}
16: {…}
17: {…}
18: {…}
19: {…}
length: 20
И если раскрыть любой из объектов, там:
calories: (...)
cautions: (...)
cuisineType: (...)
dietLabels: (...)
digest: (...)
dishType: (...)
healthLabels: (...)
image: (...)
ingredientLines: (...)
ingredients: (...)
label: (...)
mealType: (...)
nexthref: "https://api.edamam.com/api/recipes/v2?q=%20hen&app_key=%20ca99304a9de5bc6c29f01da311d0ba25&_cont=CHcVQBtNNQphDmgVQntAEX4BYlNtBQEDSmJBAWcRZ1FyAAMCUXlSVjYRMAN6VQtSRzBCCjcaNl1xBwYCEWIWBzATMFYhBVEVLnlSVSBMPkd5BgMbUSYRVTdgMgksRlpSAAcRXTVGcV84SU4%3D&type=public&app_id=52d453a9"
shareAs: (...)
source: (...)
totalDaily: (...)
totalNutrients: (...)
totalTime: (...)
totalWeight: (...)
uri: (...)
url: (...)
yield: (...)
Код запроса:
async addNewRecept() {
try {
const recept = await fetch(this.receptAll[this.receptAll.length - 1].nexthref);
if (recept.type === 'cors') {
const result = await recept.json();
for (let i = 0; i < result.hits.length; i += 1) {
this.receptAll.push(result.hits[i].recipe);
}
}
} catch (error) {
console.error(error);
}
},
Получаю первые 20 рецептов в переменную receptAll таким образом:
created() {
this.getRecept();
},
methods: {
async getRecept() {
try {
const recept = await fetch(
'https://api.edamam.com/api/recipes/v2?type=public&q=%20hen&app_id=52d453a9&app_key=%20ca99304a9de5bc6c29f01da311d0ba25',
);
const result = await recept.json();
for (let i = 0; i < result.hits.length; i += 1) {
this.receptAll.push(result.hits[i].recipe);
// eslint-disable-next-line no-underscore-dangle
this.receptAll[i].nexthref = result._links.next.href;
}
} catch (error) {
console.error(error);
}
},
https://codepen.io/salco2012/pen/gOxJoZv
Ответы (1 шт):
Автор решения: Sanya H
→ Ссылка
Потому что у Вас есть проверка if (recept.type === 'cors') {, а соответственно, если условие не выполняется (а оно не выполняется), то никакие данные не будут добавлены.
Более того, пагинация изначально должна содержать все страницы, а не изменятся при подгрузке данных!

