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

这篇具有很好参考价值的文章主要介绍了element ui - el-select获取点击项的整个对象item。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1.背景

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

2.实例

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

element ui - el-select获取点击项的整个对象item,vue.js,elementui,el-select 需注意 value-key="id" :value="item"

<template>
  <el-select
    v-model="value"
    multiple
    v-model="obj" value-key="id" @change="change">
    <el-option
      v-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>