HTML

<div class="scroll-wrap" >    <div        v-for="(item2,index2) in jsonList.rightArr1"        :key="index2"        class="scroll-content"        :style="{ top }"         @mouseenter="Stop()"        @mouseleave="Up()"      >        <wrap class="marginT-14 pt-4 pb-4 pl-8 pr-8 cursor" :open="true">          <div class="flex">            <span class="fs-14">{{item2.name}}</span>            <span class="fs-14">{{item2.time}}</span>          </div>          <div class="flex">            <span class="colorH fs-14">{{item2.miaoshu}}</span>            <span class="fs-14">{{item2.type}}</span>          </div>        </wrap>      </div>  </div>

data

activeIndex: 0,intnum: null

computed

computed: {    top () {      return -this.activeIndex * 62 + 'px';      //62的值是单条滚动的高度 + 间隔下一条的间隔得出（下边距）    }  },

mounted

this.ScrollUp()

methods

ScrollUp () {  this.intnum = setInterval(()=> {    if (this.activeIndex < this.jsonList.rightArr1.length) {      this.activeIndex += 1    } else {      this.activeIndex = 0    }  }, 1000)},Stop () {  clearInterval(this.intnum)},Up () {  this.ScrollUp()},

css

.scroll-wrap{    height: 100%;    overflow: hidden;    .scroll-content{      position: relative;      transition: top 0.5s;    }  }