vue中使用better-scroll滾動無效

安裝

npm install better-scroll --save

調用：

//重要是這兩個標紅的class類名 
<div class="wrapper recommend" ref="wrapper">
    <div class="content recommendHeight">
      <h2 class="recommendSinge">推薦歌單</h2>
      <ul class="recommendContent">
        <li class="ContentLi" v-for="item in playList" :key="item.id">
          <div class="text">
            <p class="textContent">{{item.name}}</p>
          </div>
        </li>
      </ul>
    </div>
  </div>

 

import BScroll from "better-scroll";
 // 獲取推薦歌單
    _getRecommendList() {
      getRecommendList().then(res => {
        if (res.status === this.$ERR_OK) {
          this.playList = res.data.result;
          this.$nextTick(() => {
            if (!this.scroll) {
              this.scroll = new BScroll(this.$refs.wrapper, {});
              this.scroll.on("touchEnd", pos => {
                // 下拉動作，下拉刷新 重新獲取數據
                if (pos.y > 50) {
                  this._getRecommendList();
                }
              });
            } else {
              this.scroll.refresh();
            }
          });
        } else {
          console.error("getRecommendList 獲取失敗");
        }
      });
    }

　　mounted() {

    this._getRecommendList();

  }

遇到一個比較坑的問題就是布局問題 上邊的步驟引進這個插件 也正確調用了，但死活就是不能拉，拉不動，上網搜了很多方法也沒用 后來無意中看到一個是說要給wrapper定位

.wrapper{
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
}

就，就 真的好了 太坑了