Javascript 在vue js中以特定时间间隔循环浏览图像列表

我正在尝试循环我设备上的一组图像，循环中的所有图像都显示得很好，但我只想在页面加载时显示阵列中的第一个图像，每4秒钟后，我想将图像更改为阵列中的下一个图像，并为每个图像的进入和离开设置动画，我尝试了很多方法来实现这一点，比如if语句，但我相信v-for和transitiongroup是实现这一点的最好方法，但我仍然做不到。 谢谢

数据（）{
返回{
图片：[“ice.png”，“g3.png”，“w3.png']
}
},
方法：{
getImageUrl（imageUrl）{
返回require（'../assets/Images/'+imageUrl）；
}
}

。淡入淡出{
不透明度：0
}
。淡入激活状态{
过渡：不透明度1s缓进缓出
}
.淡入淡出激活状态{
不透明度：0；
过渡：不透明度1s缓进缓出
}