vue better-scroll总结

html 结构如下

{{toptishi}}

• 
  
  
  
  
  
  
  
  

  {{item.gameName}}

  {{item.descriptor}}

  
  

  
  
  
  
  

  
  
  
  
  
  

{{bottishi}}

其中 content 区域内为滚动区域，（是wrapper下的第一个div）

js如下

import better-scroll；

后台交互：loadData（）；

methods：{

 await this.$axios({
                    method: "post",
                    url: "",
                }).then((res)=>{
                    this.data = res.data.concat(this.data);
                    this.$nextTick(() => {
            if (!this.scroll) {
              this.scroll = new BScroll(this.$refs.wrapper, {});
              console.log(this.scroll);
              this.scroll.on('touchEnd', (pos) => {
              console.log(pos);
                if (pos.y > 50) {
                  this.page=parseInt(this.page)+parseInt("1");
                  if(this.page>this.totalPage){
                  this.toptishi = "已经加载全部"
                  }else{
                  this.getDate()
                  }
                  
                }
                if(this.scroll.y <= (this.scroll.maxScrollY + 50)) {
                this.bottishi = "刷新成功"
}else{

}
              })
            } else {
              this.scroll.refresh()
            }
    })
        })

}

此处为下拉加载，上拉刷新；

两处知识点：concat 方法 上拉触发应该是touchEnd（大写）

若上拉加载 下拉刷新时   原有数据上.concat(新数据)