Vue选择的道具不适用于v模型

Question

我用于以下操作时，:selected道具未option在Vue2中选择目标：v-modelselect

模板

...
<select v-model="form.item">
    <option :value="item.id" v-for="(item, index) in items" :selected="item.status == 2">{{ item.name }}</option>
</select>
...

脚本

data: function () {
    return {
        items: [{id:1, name: "foo", status: 1},{id: 3, name: "bar", status: 2}],
        form: {item: null}
    }
}

在这种情况下，安装后没有选定的选项。

我怎样才能解决这个问题？

注意

当我删除v-model它工作正常（目标option默认情况下选中），但我没有选择的值option在form.item

Answer 1

v模型将忽略初始值，选中或选定的属性。在任何表单元素上找到

解决方案是删除：selected绑定。并使用数据道具绑定到v模型

<select v-model="form.selectedItem">
   <option :value="item.id" v-for="(item, index) in items">{{ item.name }}
   </option>
</select>

将vue实例声明为

data() {
 return {
  selectedItem: 2
 }
}

链接到官方文档