vue.js element-ui select选择器 选中对象

element-ui select选中对象 下拉菜单选中对象

element-ui api文档上说，select的v-model值只能是boolean/number/string，虽然对象不在此列，其实是可以绑定对象的。

要实现绑定对象，只需要两步，第一，option标签上value绑定对象。第二，在select标签上，声明value-key，它是option value对象的唯一标识属性，通常是id、code之类的，注意value-key是字符串类型，如果v-model唯一属性是value，则可value-key可省略。

<el-select
	value-key="id"
	v-model="order"
>
	<el-option v-for="(order,idx) in orders"
	:key="idx"
	:label="order.name"
	:value="order"
	></el-option>
</el-select>

export default{
 data(){
  return {
	orders:[
		{
			id:1,
			name:"烤鱼"
		},{
			id:2,
			name:"烤羊腿"
		}
	]
	}
}
}

value和v-model的区别

select的value和v-model的区别，value是单向的,value变更会影响下拉菜单的选中项，但变更选中的下拉菜单，不会再同步到value。
model是双向的，v-model变更会影响下拉菜单的选中项，同时下拉选项变更也会同步到v-model。