vue第五课：图片切换实例

知识点：

1，定义图片数组 2，添加图片索引 3，绑定src属性 4，图片切换逻辑

需求：

1. 第一张图片不显示上一页（隐藏）
2. 最后一张图片不显示下一页（隐藏）

  <div id='app'>
  <img :src="imgarr[index]">
  <a href="#" v-show="index!=0" @click="prev">
    <img src="./img/prev.gif">
    </a>
  <a href="#" v-show="index<imgarr.length-1"  @click="next">
    <img src="./img/next.gif">
   </a>
  </div>
  <script>
    Vue.config.productionTip = false //阻止vue在启动时生成生产提示。
    var app = new Vue({
      el: '#app',
      data: {
       imgarr:[
        "./img/1.jpg",
        "./img/2.jpg",
        "./img/3.jpg",
        "./img/4.jpg",
        "./img/5.jpg",
        "./img/6.jpg",
       ],
       index:0,
      },
     methods: {
      prev:function(){
        this.index--;
      },
      next:function(){
        this.index++;
      }
     },
    })
  </script>