帮我用vue2写一段轮播图的代码

我不是很熟悉Vue2，但是可以尝试帮你写一段代码：<template>
<div class="carousel">
<div class="slides">
<img v-for="(image, index) in images" :key="index" :src="image"/>
</div>
<div class="dots">
<span v-for="(image, index) in images" :key="index" @click="goToSlide(index)"></span>
</div>
</div>
</template><script>
export default {
data() {
return {
images: [require('../assets/Image1.png'),
require('../assets/Image2.png'),
require('../assets/Image3.png')],
currentSlide: 0
}
},
methods: {
goToSlide(index) {
this.currentSlide = index;
}
}
}
</script><style scoped>
.carousel {
width: 100%;
overflow: hidden;
}
.slides {
display: flex;
width: 100%;
position: relative;
left: -100%;
animation: carousel 30s linear infinite;
}
.slides img {
width: 100%;
object-fit: cover;
object-position: center;
}
.dots {
width: 100%;
display: flex;
justify-content: center;
}
.dots span {
background: #ddd;
border-radius: 50%;
width: 10px;
height: 10px;
margin: 0 5px;
cursor: pointer;
}
@keyframes carousel {
0% {
left: -100%;
}
16.666% {
left: -100%;
}
25% {
left: -200%;
}
41.666% {
left: -200%;
}
50% {
left: -300%;
}
66.666% {
left: -300%;
}
75% {
left: -400%;
}
91.666% {
left: -400%;
}
100% {
left: -100%;
}
}
</style>