Estoy creando un componente personalizado (un control deslizante), pero por ahora solo pasa imágenes a través de una matriz, lo que quiero es que, en lugar de pasar imágenes, pueda insertar un componente secundario a través de una ranura sin usar matrices.

 <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>

este es el guion

 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) } } }