vue 局部滚动 better-scroll

better-scroll只处理容器（wrapper）的第一个子元素（content）的滚动，其它的元素都不会有效果。
所以布局一定要正确，父元素要有高度

安装
npm install better-scroll --save

在main.js里引入

// 局部滚动
import BScroll from "better-scroll";
Vue.prototype.BScroll = BScroll

html
当前使用页面

 <div class="wrapper" ref="wrapper" :style="{height: heighNum}">
      <ul class="content">
        <div v-for="em in banner" :key="em.id" @click="add(em)" class="newList">
          <el-row>
            <el-col :span="11">
              <h5 v-html="em.title"></h5>
              <span class="txt">新闻</span>
            </el-col>
            <el-col :span="13">
              <img :src="[GLOBAL.myhf + em.image]" alt class="main_img" />
            </el-col>
          </el-row>
        </div>
      </ul>
    </div>

js

<script>
mounted() {
    setTimeout(() => {
    
      this.scroll = new this.BScroll(this.$refs.wrapper, {});
    }, 3000);
  },
</script>

style

 .wrapper {
        width: 6rem;
        margin-top: 0.5rem;
        overflow: hidden;
    }