element ui - el-select获取点击项的整个对象item

 1.背景

在使用 el-select 的时候，经常会通过 change 事件来获取当前绑定的 value ，即对象中默认的某个 value 值。但在某些特殊情况下，如果想要获取的是点击项的整个对象 item，该怎么做呢？

2.实例 

elementUI 中是可以支持获取点击项的整个对象的。

需注意  value-key="id" :value="item"

<template><el-selectv-model="value"multiplev-model="obj" value-key="id" @change="change"><el-optionv-for="item in options":key="item.value":label="item.label":value="item"></el-option></el-select>
</template><script>export default {data() {return {value:'',options: [{id: 1,label: '黄金糕'}, {id: 2,label: '双皮奶'}, {id: 3,label: '蚵仔煎'}, {id: 4,label: '龙须面'}, {id: 5,label: '北京烤鸭'}],value1: [],value2: []}},methods: {change(item) {console.log(item);// 打印整个对象}}}
</script>

延伸：

vue.runtime.esm.js:619 [Vue warn]: <transition-group> children must be keyed: <ElTag> 

 在选择点击获取某个值是，“未选中”，原因为：value-key="id" id的值为数值类型

value-key="''+id" 将数值类型转换为字符串类型即可