在vue multiselect中绑定v-model并在列表中基于它创建对象

7rtdyuoh  于 2022-11-25  发布在  Vue.js
关注(0)|答案(1)|浏览(143)

尝试使用prime vue和multiselect创建一个动态生成的对象列表。绑定到变量的简单v-model创建一个选定选项列表。

<MultiSelect v-model="selected_signals" optionLabel="name" optionValue="name" :options="simu_signals" />

假设3个信号的输出为:

selected_signals = ['signal1', 'signal2', 'signal3']

我需要的是,每次选择一个选项时,生成一个具有所选信号默认配置的对象。因此,我需要的这3个信号的相同输出应为:

selected_signals = [{
    name: 'signal1',
    interpolation: true,
    unit: '',
    type: 'origin'
},
{
    name: 'signal2',
    interpolation: true,
    unit: '',
    type: 'origin'
},
{
    name: 'signal3',
    interpolation: true,
    unit: '',
    type: 'origin'
},
]

我努力尝试监听@change事件,然后创建结构,但在这种情况下,Multiselect没有绑定到任何值,所以我无法从列表等中删除它们。

3pvhb19x

3pvhb19x1#

vue-multiselect有一个@input事件,但在此用例中并不真正需要它。
检查下面的工作示例,其中我删除了optionValue
第一个

相关问题