vue3 使用better-scroll滚动


在GitHub里搜索这个名称

 

 

 然后点进去,获取下载方式,通过vue终端进行下标

 

 

 

 

 

 

 

 下载完成在需要的Vue组件页面里引入

 

 在视图HTML上我们要滚动的结构要使用两层div包裹,并给出相应的class

 

 

 

 其次在js里即逻辑层

一般在vue3里我们所有的代码都是写在setup里的所以我们需要在这个页面加载完成后写入

即写在onMounted里

在写入onMounted里时我们也要先引入到当前页面才可使用

 

 然后setup(){ 

  onMounted(()=>{
  写入事件方法等、。。。。。
  })

}

 

 

betterscroll的属性probetype设置3,
当 probeType 为 1 的时候,会非实时(屏幕滑动超过一定时间后)派发 scroll 事件
当 probeType 为 2 的时候,会在屏幕滑动的过程中实时的派发 scroll 事件;
当 probeType 为 3 的时候,不仅在屏幕滑动的过程中,而且在 momentum 滚动动画运行过程中实时派发 scroll 事件。
如果没有设置该值,其默认值为 0,即不派发 scroll 事件
refresh:
  重新计算 better-scroll,当 DOM 结构发生变化的时候务必要调用确保滚动的效果正常。例:scroll.refresh();
 

 css

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM