美文网首页
vue项目中解决滚动的第三方解决方案

vue项目中解决滚动的第三方解决方案

作者: GaoXiaoGao | 来源:发表于2020-11-11 17:28 被阅读0次

https://github.com/ustbhuangyi/better-scroll

1.导入BScroll

import BScroll from 'better-scroll';

2.创建BScroll对象并配置参数

.wrapper 为使用滚动的最外层div定义的class=".wrapper"

mounted(){
    this.scroll = new BScroll(document.querySelector('.wrapper'),{

      // 监听滚动,惯性或者手指滑动都可以监听到
      probeType:3,
      // 使用上拉加载更多
      pullUpLoad:true
    })

    this.scroll.on('scroll',(position)=>{
      console.log(position)
    });

    this.scroll.on('pullingUp',()=>{
      console.log("上拉加载更多")

      setTimeout(()=>{
        this.scroll.finish();
      },2000)
    })
  }

相关文章

网友评论

      本文标题:vue项目中解决滚动的第三方解决方案

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