vue+element使用走马灯carousel轮播图效果，两张图片是切换样式不对

Question

如题，当走马灯只有两张图片是。我点击第一张图，点击右侧的切换，切换到第二张图（没问题），再次点击右侧切换，切换到第一张图（有问题！），第一次切换时动画效果是右滑，第二次切换时变成了左滑

Answer 1

Answer 2

正常现象，因为你的图片列表已经到达最右边了，再右移，会移回第一个，现象就是跟之前相反的动画方向；
思路就是

1、在最后一张图后边再放一张第一张的图
2、在第一张图前边放本来的最后一张的图；
3、最前和最后的移动动画完成后，js不用动画移动到中间对应的位置；

示例：

 1、三张图1，2，3，改为3'，1，2，3，1'，其中3'等于3,1'等于1； 
 2、动画移动到1'后，js立刻定位到1，这时注意不要动画；
 3、同理动画移动到3'后，js立刻定位到3，这时注意不要动画；

这样效果就是始终一个方向轮播了；

Answer 3

如果只有两张图 1,2;需要将数组中的图片在复制一份插入数组中,即 1,2,1,2;循环的时候每一次的下一张都是不一样的,样式也不会有问题.