我需要一个支持标记并且可以轻松设置样式的下拉菜单,所以我决定实现vue-multiselect
. 它可以工作,但问题是页面加载时我的下拉列表中有一个预定义的标签,而我没有那个标签,我该如何删除它?这是它现在的样子:
这是我希望它看起来的样子:
这是我的html代码:
<div>
<multiselect v-model="value" tag-placeholder="Add this as new tag" placeholder="Assesors" label="name" track-by="code" :options="options" :multiple="true" :taggable="true" @tag="addTag"></multiselect>
</div>
这是我的js:
data () {
return {
showAddUserDialog: false,
value: [
{ name: 'Assesors', code: 'as' }
],
options: [
{ name: 'Assesors', code: 'as' },
{ name: 'Finance', code: 'fi' },
{ name: 'Sales', code: 'sa' }
]
}
},
methods: {
addTag (newTag) {
const tag = {
name: newTag,
code: newTag.substring(0, 2) + Math.floor((Math.random() * 10000000))
}
this.options.push(tag)
this.value.push(tag)
}
}