Vue js识别选定的选项答案

【问题标题】：Vue js recognize selected optionVue js识别选定的选项
【发布时间】：2026-01-13 00:10:01
【问题描述】：

我有包含city.name 和city.id 的城市对象。我也有 cameras 具有 city_id 的对象：cameras.city_id。在我的 html 中：

<div v-for="camera in cameras">
    <select v-model="camera.city_id" class="form-control">
        <option v-for="city in cities" selected>@{{ city.name }}</option>
    </select>
</div>

我必须识别对象的哪个元素应该被标记为选中，简单地说标记元素为选中如果city.id == camera.city_id。每个循环只会出现一次。我该如何管理？谢谢。

【问题讨论】：

标签： vue.js

【解决方案1】：

您应该在这样的选项上使用value：

<div v-for="camera in cameras">
    <select v-model="camera.city_id" class="form-control">
        <option v-for="city in cities" :value="city.id">@{{ city.name }}</option>
    </select>
</div>

这样做，v-model 指令将自动为您选择正确的option。

更多信息请参见：http://vuejs.org/guide/forms.html#Select

【讨论】：