For making a chip closable
Reset Chips
{{ chip }}
<template>
<div class="demo-alignment">
<vs-button v-if="chips.length == 0" @click="reset" type="filled">Reset Chips</vs-button>
<vs-chip @click="remove(chip)" v-for="(chip, index) in chips" :key="index" closable> {{ "\{\{ chip \}\}" }}} </vs-chip>
</div>
</template>
<script>
export default {
data(){
return {
chips:[
'Dribbble',
'GitHub',
'Behance',
'Vuejs',
'Vuexy',
],
}
},
methods: {
reset () {
this.chips = [
'Dribbble',
'GitHub',
'Behance',
'Vuejs',
'Vuexy',
]
},
remove (item) {
this.chips.splice(this.chips.indexOf(item), 1)
}
}
}
</script>