Vue 多重选择的自定义标签不起作用？

Question

我有2个MultiSelect下拉菜单-一个带有'Single'模式，一个带有'Tags'模式。我想在两者上显示一个自定义标签，其中包含两个选项的属性，但这似乎不起作用-两个下拉框仍然只显示"正常"标签(在这两种情况下，这只是选项的名称)。

<MultiSelect v-model="booking" :options="clients" :object="true" :searchable="true" :custom-label="({ name, tel }) => `${name} - [${tel}]`" valueProp="id" label="name" trackBy="name" placeholder="Pick client" />
<MultiSelect v-model="invoice" mode="tags" :object="true" :options="services" :searchable="true" :custom-label="({ name, price }) => `${name} - [${price}]`" valueProp="id" label="name" trackBy="name" placeholder="Add Services" />

选项格式:

const clients = ref([{ 
name: 'John Davis',
tel: '88888888', 
address: 'London, UK'
}, { 
name: 'David Smith', 
tel: '77777777', 
address: 'NY, USA'
}]);
const services = ref([{ 
name: 'Marketing',
service: 'Do some marketing', 
price: '£150.00'
}, { 
name: 'Sales', 
service: 'Do some sales', 
price: '£100.00'
}]);

出什么事了?

Answer 1

我在这里测试了你的代码，发现这是工作的。

可能你正在使用的版本有问题。如果您使用的是ve3，请安装vue-multiselect@next。