Better-Scroll可滚动区域问题

解决Better-Scroll可滚动区域的问题

Better-Scroll在决定有多少区域可以滚动时，是根据scrollerHeight属性决定

1. scrollerHeight属性石根据放Better-Scroll的content中的子组件的高度
2. 但是页面刚开始加载，计算scrollerHeight属性的时候，由于图片加载较慢，就会将图片的高度不计算在内，所以计算出来的是错误高度
3. 后来图片加载进来之后就有了新的高度，但是scrollerHeight属性并没有进行更新，所以滚动会出现问题，
   如何决绝Better-Scroll出现的可滚动区域问题？
4. 监听每一张图片是否加载完成，只要有一张图片加载完成了就执行一次refresh()
5. 如何监听图片加载完成？

一、原生的js监听图片，img.onload = function(){}
二、vue中监听@load=“方法”

6. 调用scroll的refresh进行刷新，更新滚动的高度。

解决方案：
第一步、现在main.js中创建一个bus总线，也就是一个vue实例bus

第二步、在需要没加载一张图片获取一次的高度的代码上添加imgload代码

通过Bus总线发送itemImageload事件

第三部步、祖组件监听从孙组件的事件，没监听一次刷新一次scroll中的高度

解决方法【事件总线】

	bus->总线
	Vue.prototype.$bus = new Vue
	this.bus.emit('事件名称',参数)
	this.bus.on('事件名称',回调函数(参数))

效果：