scroll 监听

问题描述 ：
项目中使用了better-scroll库，同时想监听scroll事件的时候，发现无法监听到。

setTimeout(()=>{
          this.initScroll();
          this.scroll.on('scroll', ()=>{console.log('scroll' , )}, false)
          this.scroll.on('pullingUp',()=> {
       
          });
          this.scroll.on('pullingDown',()=> {
              
          });
},20)

//  this.box  和this.scroll 指向统一元素
this.box.addEventListener('scroll', ()=>{console.log('scroll')}, false)
// 无法监听到事件

猜测一：better-scroll 内部绑定事件前，会把之前绑定的事件取消掉。
但是发现，把绑定事件代码加到better-scroll绑定事件代码之后 仍然不行。

猜测二：better-scroll内部使用的是touch事件，preventDefault默认值为true，会阻止页面的默认行为。
当把preventDefault设置为false之后，发现可以监听到滚动事件。
但是这一修改可能会导致其他的问题，所以其实并不是很建议。

解决方案 ：
其实better-scroll的API就可以发现，可以直接在内部注册 。

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

注：

• 使用on注册事件， 同一个元素只能绑定一个scroll事件。后注册的事件会覆盖前注册的事件
• 使用addEventListener注册事件，允许注册多个

this.ele = document.querySelector('.scroll')
this.ele.onscroll = ()=>{ console.log('scroll1') }
this.ele.addEventListener('scroll',  ()=>{ console.log('scroll2') },  false)
this.ele.onscroll = ()=>{ console.log('scroll3') }
this.ele.addEventListener('scroll',  ()=>{ console.log('scroll4') },  false)

// 滚动时 打印 scroll2   scroll3  scroll4