better-scroll的使用

我把better-scroll写成了一个组件，需要使用的时候直接import使用即可

<template>
  <div class="wrapper" ref="wrapper">
    <div class="content">
      <ul>
        <slot></slot>
        <li class="content-more">没有更多数据啦~</li>   //
        <li class="space"></li>  //  后面这两个li元素读者可自行去除
      </ul>
    </div>
  </div>
</template>
<script>
import BScroll from 'better-scroll'
export default{
  mounted () {
    this.$nextTick(() => {
      if (!this.scroll) {
        this.scroll = new BScroll(this.$refs.wrapper, {
          click: true
        })
      } else if (!this.$refs.wrapper) {

      } else {
        this.scroll.refresh()
      }
    })
  },
  updated () {
    this.scroll.refresh()
  }
}
</script>

<style lang="stylus" scoped>
.wrapper    
  padding .1rem .15rem
  width 100%
  position absolute
  top 2.2rem
  bottom 1rem  /*关键*/
  left 0
  overflow hidden
  z-index 1
  box-sizing border-box
/* 这个wrapper样式很重要，写不好会导致页面变宽这类的问题，待滑动的内容一定要高于这个wrapper，否则不能滑动 */
  .content >>> ul
      margin 0
      padding 0
  .content-more
      background-color #f5f7fa
      line-height .5rem
      text-align center
      color $themeColor2
      border-radius .1rem
      margin-top .05rem
  .space
    height .15rem
</style>