javascript - Vue无限加载与axios正在跳过第2页

Question

我正在使用vue 无限负载从本地 api 获取评论。在谷歌浏览器工具的网络选项卡中，我的页面请求应按如下方式加载：

101?页=1

101?页=2

101?页=3

101？页=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?page=2 101?page=2 101?page=4

Answer 1

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

我打了this.getComments();两次电话。一次是安装组件时，另一次是无限负载。