<template>
  <img v-if="items.length" :src="cur_img" class="w-100 h-100" />
</template>

<script>
export default {
  name: 'Carousel',
  props: ['items'],
  components: {
  },
  data: function () {
    return {
      cur: 0,
    };
  },
  computed: {
    cur_item: function() {
      return this.items[this.cur];
    },
    cur_link: function() {
      return this.cur_item.link;
    },
    cur_img: function () {
      return this.cur_item.url;
    },
  },
  methods: {
    next: function() {
      var n = this.cur + 1;
      if (n >= this.items.length) {
        n = 0;
      }
      this.cur = n;
    }
  },
  mounted() {
    setInterval(this.next, 5000);
  },
}
</script>

<style scoped>
</style>

