vue-使用transition-group实现轮播图

在仿马蜂窝的项目中，尝试使用transition-group实现轮播图

布局

关键样式：

.imgs-enter-active ,

.imgs-leave-active {

transition: all 1s ease;

}

.imgs-enter {

transform: translateX(100%);

}

.imgs-enter-to {

transform: translateX(0);

}

.imgs-leave {

transform: translateX(0);

}

.imgs-leave-to {

transform: translateX(-100%);

}

定时器回调函数的内容，主要是实现mark的值的增长。

this.mark+=1;

if (this.mark === this.imgArray.length ) {

this.mark =0;

通过mark控制哪一个li显示出来