Vue бесконечная загрузка с Axios пропускает страницу 2

Question

Я использую vue бесконечная загрузка , чтобы получить комментарии от локального API.На вкладке сети в инструментах Google Chrome мои запросы к странице должны загружаться следующим образом:

101? Страница = 1

101? Страница = 2

101? Страница= 3

101? Page = 4

Но на самом деле происходит дублирование страницы 1, и страница 2 пропускается:

101? Страница = 1

101? Страница = 1

101? Страница = 3

101? Страница = 4

Код

data() {
    return {
        comments: [],
        parentPageCount: 1,
        postId: 101,
        loggedInUser: null,
    }
}
mounted(){
        //this.getComments();
},
methods:{
    getComments: function($state){
        axios({
            method: 'GET',
            url: 'mysite.com/'+this.postId+'?page='+this.parentPageCount,
            data: {

            }
        }).then(function (response) {

            this.loggedInUser = response.data.user;

            if (response.data[0].data.length) {
                this.parentPageCount ++;
                if (this.comments.length === 0) {
                    this.comments = response.data[0].data;
                    console.log('gotten page: '+this.parentPageCount);
                } else {
                    this.comments = this.comments.concat(response.data[0].data);
                }
                $state.loaded();
            } else {
              $state.complete();
            }
        }.bind(this))
        .catch(function (error) {
            return "There was an error."
        });
    },
}

Примечание: Эта страница пропускается, даже если я изменяю parentPageCount проп в 2. Таким образом, это будет: 101? Страница = 2 101?страница = 2 101? страница = 4

Answer 1

mounted(){
  //this.getComments();
},

Я звонил на this.getComments(); дважды.Один раз, когда компонент был смонтирован, а другой - на бесконечной нагрузке.