我使用这个漂亮的包Vue-Multiselect,在multiple
模式下。
<multiselect v-model="values" :options="options" :multiple="true"
label="name" track-by="name" @select="select" @input="input"
>
</multiselect>
添加选项时,我希望使用不同的group
删除选定的选项
const options = [
{ name: "Option 1", group: 1 },
{ name: "Option 2", group: 1 },
{ name: "Option 3", group: 2 },
];
如果我在这里选择“选项3”,其他选项必须从选择中删除
如果我选择“选项2”,则必须删除“选项3”,但不删除“选项1”,等等。
首先,我考虑使用select
事件修改input
之前的选定值
export default {
components: {
Multiselect
},
data() {
values: [],
options: options
},
methods: {
select(option) {
this.values = this.values.filter(value => value.group != option.group);
},
input(options) {
console.log(options);
},
}
}
但之后似乎被覆盖了。
在选择时,如何删除不同组的选定选项?
1条答案
按热度按时间mhd8tkvw1#
在“values”数组上添加一个观察器(在v-model中传递),并在观察器中使用以下逻辑。
这不会覆盖该值。