vue新闻滚动_vue如何做新闻列表上下滚动的效果

慕的地8271018

可以换一种思路，使用transition实现

   

•        
• {{item.name}}     

export default {  data () {    return {      prizeList: [        { name: 0 },        { name: 1 },        { name: 2 },        { name: 3 },        { name: 4 }      ],      activeIndex: 0    }  },  computed: {    top() {      return - this.activeIndex * 50 + 'px';    }  },  mounted() {    setInterval(_ => {      if(this.activeIndex < this.prizeList.length) {        this.activeIndex += 1;      } else {        this.activeIndex = 0;      }    }, 1000);  }};.scroll-wrap{  width: 200px;  height: 50px;  border: 1px solid blue;  overflow: hidden;}.scroll-content{  position: relative;  transition: top 0.5s;  li{    line-height: 50px;    text-align: center;  }}