vue 利用 计算属性computed 实现轮播图 上一页 和下一页功能

vue 利用 计算属性computed 实现轮播图 上一页 和下一页功能

1.页码

[code] <ul class="slide-pages">
<li @click="goPage(prevIndex)">&lt;</li>
<li v-for="(item,index) in slides" :key="index">
<a>{{index +1}}</a>

</li>
<li @click="goPage(nextIndex)">&gt;</li>
</ul>

[code] computed: {
// 上一页
prevIndex() {
if (this.noeIndex === 0) {
return this.slides.length - 1;
} else {
return this.nowIndex - 1;
}
},
// 下一页
nextIndex() {
if (this.nowIndex === this.slides.length - 1) {
return 0;
} else {
return this.nowIndex + 1;
}
}
},