<div class="swiper_info">
<img class="icon" src="@/assets/img/msg.png" alt>
<ul>
<li v-for="(item,index) in newHotList" :key="index" :class="!index && play ? 'toUp' : ''">
{{item.nickName}}
<span>{{item.gift}}</span>
</li>
</ul>
</div>
mounted() {
this.hotTimer = setInterval(this.startPlay, 2000);
}
methods: {
startPlay() {
let that = this;
that.play = true; //开始
setTimeout(() => {
that.newHotList.push(that.newHotList[0]); //将第一条数据塞到最后一个
that.newHotList.shift(); //删除第一条数据
that.play = false; //暂停
}, 1000);
}
}
<style>
.toUp {
margin-top: -0.7rem;
transition: all 0.5s;
}
</style>