当elementUi 中select选中值绑定为对象时，操作selected时默认高亮的value如何正常显示

李维亮

发布于 2021-07-08 10:08:27

2.2K0

发布于 2021-07-08 10:08:27

代码：

<el-select placeholder="选择套餐" size='small' value-key="id" v-model="form.chooseMeal" @change="selectedMeal"  clearable style="width: 100%">
      <el-option v-for="item in packageList" :key="item.id" :label="item.name" :value="item"></el-option>
</el-select>

注意事项： 1.如上代码value绑定的是item的对象; 2.首先在el-option中添加:key="item.id"的属性; 3.然后在el-select 添加value-key="id"属性，注意value-key前面没有: 4.注意value-key的值与key绑定的属性值对应。

最后肯定有人问我是怎么找到，看文档， http://element-cn.eleme.io/#/zh-CN/component/select 在这个链接demo底下，Attributes上面就有这么一条标注，很明显 如果 Select 的绑定值为对象类型，请务必指定 value-key 作为它的唯一性标识。

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2018-10-22，如有侵权请联系 cloudcommunity@tencent.com 删除

attributes