Vue-multiselect
Example fiddle for issue reproduction usage
HTML
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/vue-multiselect.min.css">
<script src="https://unpkg.com/[email protected]/dist/vue-multiselect.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/vue-multiselect.min.css">
<div id="app">
<multiselect v-model="value" :options="options" :multiple="true" track-by="library"
:custom-label="customLabel">
</multiselect>
<pre>{{ value }}</pre>
</div>
CSS
* {
font-family: 'Lato', 'Avenir', sans-serif;
}
Babel + JSX
new Vue({
components: {
Multiselect: window.VueMultiselect.default
},
data: {
value: [{ language: 'JavaScript', library: 'Vue-Multiselect' }],
options: [
]
},
methods: {
customLabel (option) {
return `${this.value.length}, ${option.library} - ${option.language}`
}
}
}).$mount('#app')