根據(jù)vue-music視頻中slider組建的使用，當安裝新版本的better-scroll，輪播組件，不能正常輪播

這是因為，better-scroll發(fā)布新版本之后，參數(shù)設置發(fā)生改變

這是舊版本： 組件為slider

<template> <div class="slider" ref="slider">  <div class="slider-group" ref="sliderGroup">   <slot>   </slot>  </div>  <div class="dots">   <span class="dot" :class="{active: currentPageIndex === index }" v-for="(item, index) in dots" :key="item.id"></span>  </div> </div></template><script type="text/ecmascript-6">import { addClass } from "common/js/dom";import BScroll from "better-scroll";export default { name: "slider", props: {  loop: {   type: Boolean,   default: true  },  autoPlay: {   type: Boolean,   default: true  },  interval: {   type: Number,   default: 4000  } }, data() {  return {   dots: [],   currentPageIndex: 0  }; }, mounted() {  setTimeout(() => {   this._setSliderWidth();   this._initDots();   this._initSlider();   if (this.autoPlay) {    this._play();   }  }, 20);  window.addEventListener("resize", () => {   if (!this.slider) {    return;   }   this._setSliderWidth(true);   this.slider.refresh();  }); }, activated() {  if (this.autoPlay) {   this._play();  } }, deactivated() {  clearTimeout(this.timer); }, beforeDestroy() {  clearTimeout(this.timer); }, methods: {  _setSliderWidth(isResize) {   this.children = this.$refs.sliderGroup.children;   let width = 0;   let sliderWidth = this.$refs.slider.clientWidth;   for (let i = 0; i < this.children.length; i++) {    let child = this.children[i];    addClass(child, "slider-item");    child.style.width = sliderWidth + "px";    width += sliderWidth;   }   if (this.loop && !isResize) {    width += 2 * sliderWidth;   }   this.$refs.sliderGroup.style.width = width + "px";  },  _initSlider() {   // better-scroll 對外暴露了一個 BScroll 的類   // Vue.js 提供了我們一個獲取 DOM 對象的接口—— vm.$refs   this.slider = new BScroll(this.$refs.slider, {    scrollX: true,    scrollY: false,    momentum: false,    snap: true,    snapLoop: this.loop,    snapThreshold: 0.3,    snapSpeed: 400   });   // 是否派發(fā)滾動到底部事件，用于上拉加載  // 切換到下一張的時候派發(fā)的事件   this.slider.on("scrollEnd", () => {    let pageIndex = this.slider.getCurrentPage().pageX;    if (this.loop) {     pageIndex -= 1;    }    this.currentPageIndex = pageIndex;    if (this.autoPlay) {     this._play();    }   });   // 是否派發(fā)列表滾動開始的事件   this.slider.on("beforeScrollStart", () => {    if (this.autoPlay) {     clearTimeout(this.timer);    }   });  },  _initDots() {   this.dots = new Array(this.children.length);  },  _play() {   let pageIndex = this.currentPageIndex + 1;   if (this.loop) {    pageIndex += 1;   }   this.timer = setTimeout(() => {    this.slider.goToPage(pageIndex, 0, 400);   }, this.interval);  } }};</script><style scoped lang="stylus" rel="stylesheet/stylus">@import '~common/stylus/variable';.slider { min-height: 1px; .slider-group {  position: relative;  overflow: hidden;  white-space: nowrap;  .slider-item {   float: left;   box-sizing: border-box;   overflow: hidden;   text-align: center;   a {    display: block;    width: 100%;    overflow: hidden;    text-decoration: none;   }   img {    display: block;    width: 100%;   }  } } .dots {  position: absolute;  right: 0;  left: 0;  bottom: 12px;  text-align: center;  font-size: 0;  .dot {   display: inline-block;   margin: 0 4px;   width: 8px;   height: 8px;   border-radius: 50%;   background: $color-text-l;   &.active {    width: 20px;    border-radius: 5px;    background: $color-text-ll;   }  } }}</style>