美文网首页
better-scroll使用方法总结

better-scroll使用方法总结

作者: 黑白说程序 | 来源:发表于2020-10-12 16:43 被阅读0次

1.1下拉刷新

使用下拉刷新时,要在将betterscroll的属性pullUpLoad设置为true
当使用监听事件下拉刷新,但是pullingDown回调完函数,要在最后添加this.scroll.finishPullDown(); // 作用是事情做完,需要调用此方法告诉 better-scroll 数据已加载,否则下拉事件只会执行一次

const this.scroll = new BScroll('.wrapper', {
  pullUpLoad: true,
})
this.scroll.on('pullingDown', () => {
         ......
          this.scroll.finishPullDown();
      });

1.2获取滚动位置scroll

获取滚动位置,则需要将betterscroll的属性probetype设置3,当 probeType 为 1 的时候,会非实时(屏幕滑动超过一定时间后)派发scroll 事件;当 probeType 为 2 的时候,会在屏幕滑动的过程中实时的派发 scroll 事件;当 probeType 为 3 的时候,不仅在屏幕滑动的过程中,而且在 momentum 滚动动画运行过程中实时派发 scroll 事件。如果没有设置该值,其默认值为 0,即不派发 scroll 事件
当使用监听事件中使用位置则在on绑定 scroll,并传递一个参数既可获取xy的值

const this.scroll = new BScroll('.wrapper', {
  probeType : 3,
})
this.scroll.on('scroll', (position) => {
         console.log(position)
      });

相关文章

网友评论

      本文标题:better-scroll使用方法总结

      本文链接:https://www.haomeiwen.com/subject/ttjdpktx.html