摘要：
在spa开发过程中使用vue滚动条将不可避免地遇到滚动条的使用。例如，当用户选择商品并点击购物车时，将出现一个购物车弹出窗口。如果所选商品少于三件，这是非常合适的。如果超过三个，我们需要让它们滚动。vue-scroller可以很好地解决上述滚动问题。这是他的演示。这里有几点需要注意：“main”：“dist/vuescroller.min.js”。这是package.json中的条目文件。
vue-scroller的使用
在spa开发过程中，难免会遇到使用scroll的情况，比如下面的：
即，当用户选择好商品之后，点击购物车，就会有一个购物车弹窗，如果选择的商品小于三个，刚好合适，如果多余三个，我们就需要使其滚动了。
而 vue-scroller 就可以很好的实现滚动上面的问题。 这个文件可以很容易进行测试。
使用过程可以参考github。 这是他的demo、
这里只提几点需要注意的:
- "main": "dist/vue-scroller.min.js", 这是package.json中的入口文件。
- 使用时一般都是直接引入，然后 Vue.use(); 即可。
<scroller style=" 2.4rem!important"> <!-- 循环显示分类 --> <div class="kind" v-for="item,index in items"> <a v-bind:href="'#anchor'+index" v-bind:class="{active: index==0}" v-on:click="getContent(item.id, $event)">{{item.name}}</a> <!-- 控制分类中是否显示数目，主要使用了reduce来计算总数 --> <span class="number" v-if="(typeof numbers[index] == 'undefined') ? false : (numbers[index].reduce(function (prev, current) {return ((typeof prev == 'undefined') ? 0 : prev) + ((typeof current == 'undefined') ? 0 : current);}) > 0)" > {{(typeof numbers[index] == "undefined") ? "" : numbers[index].reduce(function (prev, current) {return ((typeof prev == "undefined") ? 0 : prev) + ((typeof current == "undefined") ? 0 : current);})}} </span> </div> </scroller>
即只需要将 需要滑动部分包裹在 scroller 中就可以了，其中scroller的高度默认是100%， 所以如果希望调节高度，最好的办法是调节scroler外层div的高度。
开发自己的 scroll 插件
使用别人写好的插件总是不太好的，因为针对于当前项目而言，我只是希望实现一个scoll的功能，而对上拉、下拉等功能是没有需要的，所以使用这么大的插件是没有必要的。 我们可以根据自己的需求来开发适合自己项目使用的插件。
推荐： https://github.com/hilongjw/vue-lazyload 图片懒加载插件。