[Vuejs]-API call in lazy-load function, limiting the api response

by

0👍

✅

Changed the method in which you do the checking. Instead of doing it from cards length you loop through the results length and once you reach a card that doesnt exist you add them, keep track of the amount added and return after 2 or when there is none left. I changed the loop logic to so.

//Card with position i from results doesn't exist
if(this.cards[i] == undefined){
   //add this card - maybe add more logic to check for duplicate incase of reordering of response
   this.cards.push(response.data.results[i])
   //track card added
   cardsAdded++;
} else {
    console.log('No more cards to load')
}

//check if cards added has reach limit of 2
if(cardsAdded == 2)
    return;

See: https://jsfiddle.net/as4dm03q/

Leave a comment