轮播图

一、代码部分

甘肃省大学生

			<!--左箭头-->
			<a href="javascript:void(0)" v-show="index!=0" @click="prev"  class="left">
				<img src="./left.png"   alt=""/>
			</a>
			<img :src="imgArr[index]" style="width:400px;height：200px;" alt=""/>
				<!--右箭头-->
			<a href="javascript:void(0)" v-show="index<imgArr.length-1" @click="next"  class="right">
				<img src="./right.png"    alt=""/>
			</a>
		</div>
	</div>
	<script src="./vue.js"></script>
	<script >
		var app=new Vue({
			el:"#mask",
			data:{
				imgArr:[
					"./00.jpg",
					"./01.jpg",
					"./02.jpg",
					"./rabbit.png",
					"./img01.jpg",
					"./rabbit.png",
					"./music.png",
				],
				index:0
			},
			methods:{
				prev:function(){
					this.index--;
				},
				next:function(){
					this.index++;
				}
			},
		})
	</script>
</body>

二、视图效果