resuffle child component by array
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.4/vue.js"></script>
<div id="app">
<h1>
Following are the components
</h1>
<div v-for="comp in compArray">
<comp2 :title="comp">
</div>
<button @click="resuffle">
Resuffle
</button>
</div>
<template id="comp2">
<div>
<span>This is component 2 {{title}}</span>
</div>
</template>
JavaScript
Vue.component('comp2', {
props: ['title'],
template: '#comp2'
})
new Vue({
el: '#app',
data: {
compArray: ['comp1', 'comp2', 'comp3']
},
methods: {
resuffle: function() {
//this.compArray.push(this.compArray[1])
this.compArray.splice(0,1)
}
},
})