我想做一个类似跑马灯的抽奖，目前已经实现了图片轮播部分，代码如下：

<template>
  <div>
    <div id="swiper">
        <div class="imgBox" ref="imgBox">
            <div class="imgDiv" ref="imgDiv" v-for="(item,index) of imgList" :key="index">
                <img :src="item" />
            </div>
        </div>
    </div>
    <div @click="clickLeft">开始</div>
  </div>
</template>
<script>
export default {
    data () {
        return {
            imgList:[
                'http://n.sinaimg.cn/news/1_img/dfic/3ad618a7/107/w1024h683/20191023/46f6-ihfpfwa8114476.jpg',
                'http://n.sinaimg.cn/news/1_img/dfic/3ad618a7/107/w1024h683/20191023/f798-ihfpfwa8114474.jpg',
                'http://n.sinaimg.cn/news/1_img/dfic/3ad618a7/107/w1024h683/20191023/2e70-ihfpfwa8114472.jpg',
                'http://n.sinaimg.cn/news/1_img/dfic/3ad618a7/107/w683h1024/20191023/92ee-ihfpfwa8114467.jpg'
            ],
            timer: null,
            theSpeed: 2,
            imgWidth: 260,
            theDirection: 'left',
        }
    },
    methods:{
      clickLeft () {
        // console.log(Math.floor(Math.random() * this.imgList.length))
        this.toLeft();
      },
      toLeft () {
        let that=this;
        let imgBox = this.$refs.imgBox;
        let imgDiv = this.$refs.imgDiv;
        imgBox.innerHTML += imgBox.innerHTML;
        imgBox.style.width = imgDiv.length * this.imgWidth + 'px'; // 设置ul的宽度使图片可以放下
        function autoScroll() {
          if (imgBox.offsetLeft < -(imgBox.offsetWidth/2)) { // 向左滚动
            imgBox.style.left = 0;
          }
          that.theSpeed = -Math.abs(that.theSpeed)
          imgBox.style.left = imgBox.offsetLeft + that.theSpeed + 'px';
        }
        this.timer = setInterval(autoScroll, 30); // 全局变量 ，保存返回的定时器
      }
    },
    mounted(){
    }
}
</script>
<style scoped lang='less'>
#swiper{
  position: relative;
  width: 750px;
  height: 176px;
  overflow: hidden;
  .imgBox{
    position:absolute;
    left:0;
    top:0;
    display: flex;
    .imgDiv{
      width: 100%;
      margin-left: 15px;
    }
  }
}
</style>

但是我没有理清楚一个逻辑，由于现在是图片轮播，也就是说当第一组图片播完，图片列表重新回归到其实也就是0的位置，以达到视觉上的无缝轮播

当我点击“开始”，如何才能使图片滚动到一个指定图片的位置呢？比如，我点击“开始”，从图片列表中随机到了2下标...然后开始滚动数圈，最后下标为2的图停止在了滚动可视区左侧。

还望指点迷津，谢谢！