有時候因為需求等情況，我們需要拿到select選擇器選擇的整個對象，不光只拿到他的value

當使用element ui 的select選擇器選擇一個選項時，使用@change事件時只能得到一個Id,想要得到Id對應的對象用到filter進行過濾取到才可以。

方式一

<el-select v-model="dataForm.varietyIds" multiple placeholder="請選擇"         
  @change="changeVarietyIds">
   <el-option
     v-for="item in options"
     :key="item.id"
     :label="item.name"
     :value="item.id"
   />
 </el-select>
 
 changeVarietyIds(val) {
   this.$forceUpdate()
   let newList = []
   val.map(v => {
     const list = this.options.filter(item => {
       return item.id === v
     })
     let obj = list[0]
     newList.push(obj)
   })
 },

方式二

<el-select
  value-key="id"
  @change="searchSelect"
  v-model="addRuleform.diseaseCode"
  placeholder="請選擇"
  clearable>

    <el-option
      v-for="item in options"
      key="item.id"
      :label="item.name"
      :value="item">
     </el-option>

</el-select>


//change方法
searchSelect(val){

  console.log("val",val)

},

這里的重點在于：
1.value-key綁定唯一標識，el-option的key值是不錯的選擇
2.@change方法不帶參數
3.el-option的value綁定的是item對象

結果

?已經拿到了預期的值，后續操作就看需求。

?本文結束。