vue 中使用 better-scroll 回滚问题,上拉加载不能之后不能即使获取页面高度,

vue 中使用 better-scroll 上拉加载反弹问题,上拉反弹两次之后,才能看见上拉加载出来的数据,
不能即使刷新页面高度

<div class="main" ref="wrapper">

         <div class="main-box" >
                 <div class="box" v-for="item in data">
                         <img src="../../../static/img/banner.png" alt="" />
                         <img src="../../../static/img/banner.png" alt="" />
                 </div>
         </div>
    </div>

    .main{
        border: 1px solid red;
        width: 100%;
        position: absolute;
        top:46px;
        bottom:53px;
        overflow: hidden;
    }
    .main-box{
        display: flex;
        flex-direction: column;
    }
    .box{
        display: flex;
        justify-content: space-between;
        padding-bottom: 5px;
        
    }
    .box >img:nth-child(1){
            width: 49%;
            height: 100px;
    }
    .box >img:nth-child(2){
            width: 49%;
            height: 100px;
    }
    
    mounted(){
           this.$nextTick(() => {
             this.scroll = new BScroll(this.$refs.wrapper, {
                  pullUpLoad: {
                    threshold: -53,
                  },
                  resizePolling:60
                })
                   this.load()    //绑定上拉
            }) 
    },
    
   created(){
         this.LoadMore()   //加载数据
   },

     methods:{
           load(){   //这一部分不是加载数据,是初始化这个上拉    
            this.scroll.on('pullingUp', () => {   
                  this.LoadMore()    //上拉的时候调用
             })
        },


        LoadMore(){
             this.axios({
                    url:"/wxapi-web/diaryInfo/getDiaryInfoByCategoryId",
                    method:"get",
                    params:{
                          categoryID: -1, //请求tab的id
                          pageNum: this.pageNum, //页数
                          pageSize: this.pageSize,
                    }
                  }).then(res=>{
                      
                            this.data = [...this.data,...res.data.pageInfo.list]
                            this.pageNum++
                            console.log(this.data)
                            this.scroll.refresh()
                          this.scroll.finishPullUp()
                         
                        if (!res.data.pageInfo.hasNextPage) { //判断有没有下一页
                          this.scroll.finishPullUp()
                           console.log("加载完了")
                }    
               })
          }

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