v-infinite-scroll插件首次进入页面无效,刷新页面后可以上拉加载刷新如何解决?

在页面中使用v-infinite-scroll做上拉加载,首次进入该页面下拉不能加载,再次刷新改页面就可以,请问这种情况要如何解决?

<wv-group title="" v-infinite-scroll="loadMore" infinite-scroll-disabled="loading" infinite-scroll-distance="50" style="padding:0">
    <ul>
        <li v-for="(item,index) in boxdata" :key="item.index">
             .....内容.........    
        </li>
   </ul>
</wv-group>


export default{
    data(){
        return{
          loading:false,
          last:false,
          boxdata:[],
          pageNum:0,
          bottommain: false
        }
    },
     mounted:function(){
        var _this = this;
        _this.sub = function(){
            var url = url
            var dataJson = {)
            _this.$fetch(url,dataJson)
            .then((res) => {
                _this.loading = false;
                if (res.data.content.length > 0) {
                    for (let i = 0; i < res.data.content.length; i++) {
                        _this.boxdata.push(res.data.content[i]);
                    }
                } else {
                    _this.bottommain = true
                }
                _this.last = res.data.last
            }) 
        }
        _this.sub()     
    },
    methods:{
        loadMore () {
            let _this = this;
            if (_this.last == false) {
                if (_this.boxdata.length > 0) {
                    this.loading = true;
                    setTimeout(() => {
                    _this.pageNum = _this.pageNum + 1;
                    _this.sub()
                    }, 300)
                }
            } else {
            this.loading = false;
            if (_this.boxdata.length > 0) {
                _this.bottommain = true
            }
        }
    },
    }
}
阅读 4.3k
1 个回答

首次进入调用一下loadMore()

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题