[英]dropdown options are not selecting properly in 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"}
由于不同 label 的响应值相同,因此在选择选项时会出现故障。 当我 select “芒果”时,它会自动进入 select 第一个具有相同值的字段。 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>
由于您的一些项目具有相同的值,因此将选择列表中的第一个项目。
您可以做的是将整个 object 设置为值: :value="facility"
然后,如果您只需要所选项目的值,请从selected
属性中获取它,即您的 model: 在模板中: {{ selected.value }}
,在脚本中: this.selected.value
您的三个项目具有相同的值1371
。
它总是 select 列表中具有所选值的第一项。
值应该是唯一的。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.