Javascript vuejs中的下拉选项选择不正确

我有一个下拉列表，其中根据API响应填充选项。反应如下所示

{"value":"1371","label":"apple"},{"value":"1371","label":"banana"},{"value":"1371","label":"mango "},{"value":"1365","label":"airconditioner"},{"value":"1365","label":"refridgerator"},{"value":"1365","label":"mobile"}

由于响应对于不同的标签具有相同的值，因此在选择选项时会出现故障。当我选择“mango”时，它会自动去选择第一个具有相同值的字段。vuejs中是否有任何解决方案可以解决此问题

<select v-model="selected" class="selected-lists" size="8">
 <option v-for="facility in availableList" v-bind:value="facility.value">{{facility.label }}</option>
 </select>

{{facility.label}

您的三个项目具有相同的值

1371

它将始终选择列表中具有选定值的第一项

---

值应该是唯一的。

由于您的一些项目具有相同的值，因此将选择列表中的第一个项目

您可以将整个对象设置为值：

：value=“facility”

然后，如果您只需要所选项目的值，请从

selected

属性获取它，该属性是您的模型：在模板：

{{selected.value}

中，在脚本：

this.selected.value