I'm making a custom component (a slider), but for now it only passes images through an array, what I want is that instead of passing images, I can insert a child component through a slot without using arrays.

<div class="carousel">
<transition-group tag='ul' class="clearfix slide" name='image'>
  <li v-for='(image,index) in imglist' :key='index' v-show='index===mark'>
    <a><img :src="image"></a>
  </li>
</transition-group>
<div class="bullet">
  <span v-for='(item,index) in imglist.length' v-bind:key="item" :class="{'active':index===mark}" @click='change(index)'></span>
</div>

this is the script

 data() {
    return {
      mark: 0,
       imglist: ['images/bn1.jpg',
    'images/bn2.jpg',
    'images/bn3.jpg'
  ]
    }
  },
  created() {
    this.play()
  },
  methods: {
    change(i) {
      this.mark = i
    },
    autoPlay() {
      this.mark++;
      if (this.mark === this.imglist.length) {
        this.mark = 0;
        return
      }
    },
    play() {
      setInterval(this.autoPlay, 3000)
    }
  }
}