JSFiddle - React, Tailwind, and code Playground

HTML

<div id="vue">
  <div>
    <button @click="index--" :disabled="index <= 0">-</button>
    <button @click="index++" :disabled="index + 1 >= images.length">+</button>
    {{index}}
  </div>
    <img :src="images[index]">
</div>

CSS

img{
  width:100%
}

JavaScript

new Vue({
  el: '#vue',
  data: {
    index: 0,
    images: ['https://static1.squarespace.com/static/54e8ba93e4b07c3f655b452e/t/56c2a04520c64707756f4267/1493764650017/','https://kittenrescue.org/wp-content/uploads/2017/03/KittenRescue_KittenCareHandbook.jpg','https://img.webmd.com/dtmcms/live/webmd/consumer_assets/site_images/articles/health_tools/taking_care_of_kitten_slideshow/photolibrary_rm_photo_of_kitten_in_grass.jpg','http://www.petwave.com/~/media/Images/Center/Care-and-Nutrition/Cat/Kittensv2/Kitten-3.ashx']
  }
})