Vue的选定支柱不与V型工作

问题描述：

的:selected丙不Vue2选择目标option当我使用v-model为select：Vue的选定支柱不与V型工作

模板

... 
<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值

V模型和：选择不一起工作。它在官方文档中有解释。你只能使用其中之一。 –

@hannesneukermans你知道这个有什么好的解决方案吗？ –

答

V模型会忽略初始值，勾选或选定属性。在任何表单元素上找到！
解决方法是删除：选定的绑定。和使用数据的道具

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

声明VUE实例绑定到V模型作为

data() { 
return { 
    selectedItem: 2 
}

}

link to offical documentation

Vue的选定支柱不与V型工作

相关推荐