滚动距离

65 阅读1分钟
  <div class="day_main" ref="dayBox">
      <div class="days" ref="dayList"  v-for="(item,index) in days" :key="index" :class="{act: index == day-1}" @click.prevent="changeDay(item)">
        <span v-html="replaceLangBR(lang.breeder_day_rank,getday(dateArr[item-1]))"></span>
      </div>
  </div>
  scrollToTag(){
      //三种方法
      // this.$refs.dayList[this.day].scrollIntoView({
      //     block:"start",
      //     behavior:"smooth"
      // })

      // // 单个长度(总的长度除以数量求平均)
      // const singeWidth = this.$refs.dayBox.scrollWidth / this.days;
      // // 外盒子滚动长度
      // this.$refs.dayBox.scrollLeft = singeWidth * (this.day-1);

      // 单个长度(Dom元素去获取长度)
      let boxItemWidth = this.$refs.dayList[0].scrollWidth;
      this.$refs.dayBox.scrollTo(((boxItemWidth * this.day) - boxItemWidth), 0);
    }