1. 为什么滚动会出现问题？
Better-Scroll 在决定有多少区域可以滚动时，是根据 scrollHeight 属性决定的。scrollHeight 属性值是根据放 Better-Scroll 的 centent 中的子组件的高度决定的。但是我们的首页在刚开始计算 scrollHeight 属性时，是没有将所有的图片计算在内的，因此计算出来的高度是错误的，通常比实际高度小很多，所以我们在向下滚动时，会出现滚不动的情况。
2. 如何解决这个问题？
监听每一张图片是否加载完成，只要有一张图片加载完成，我们就执行一次 refresh()
那么如何监听图片是否加载完成呢？
- 原生的 js 监听图片：img.onload = function() {}
- Vue 中监听：@load = "方法名"
代码如下：
首先在每个小图片组件 即 GoodsListItem.vue 中监听图片加载
由于该组件和Home.vue组件之间是非父子组件，没有太大的关系，如果一层一层的传太麻烦，所以我们使用 事件总线
关于数据总线的更多介绍请参考 https://blog.csdn.net/q3254421/article/details/82927860
（1）初始化：创建事件总线
由于默认情况下 $bus（也可以起名为 $EventBus ）是没有值的，所以我们需要在 main.js 文件中将它赋值为一个 vue 实例
Vue.prototype.$bus = new Vue()
（2）在 GoodsListItem.vue 中通过事件总线发射事件
this.$bus.$emit('事件名称', 参数)
（3） 在Home.vue 组件中监听该事件
this.$bus.$on('事件名称', 回调函数(参数))
注意这里的refresh在Scroll.vue中进行了封装
于是滚动的bug解决。