After the introduction of elementUI in VUE2, the need for el-select to get the entire object item of the clicked item, rather than the default v-model item, was often encountered
The official document has the value – the use of the key = “value” https://element.eleme.cn/#/zh…
case
<template> <div> <el-select v-model="value" value-key="value" @change="change" placeholder=" > <el-option v-for="item in options" :key="item.value" :label="`${item.label}`" :value="item"><! } </el-option> </el-select> </div> </template> <script> export default {name: 'HelloWorld', data (){return {options: [{value: '1', label:' golden cake '}, {value: '2', label:' double cream '}, {value: [value: '1', label:' double cream '}, {value: [value: '1', label:' double cream '}, {value: [value: '1', label:' double cream '}, {value: 'option 3, label:' oyster omelet '}, {value: 'option 4, the label: "dragon beard noodles"}, {value:' option 5, label: 'Peking duck'}], value: ''}, created() {this.value = {value: 'option 5', label:' Beijing duck '}; }, methods: {// Chnage trigger change(e) {console.log(e); // Print the entire object}}} </script bb0 <! -- Add "scoped" attribute to limit CSS to this component only --> <style scoped> </style>