element-ui el-select 選中的value值為對象 value-key使用

 

select option綁定的value為對象時會出現問題：無法正確顯示選中的值，選項全部為藍色

 

這個是因為：官方文檔里面有寫 Element文檔 

value-key

作為 value 唯一標識的鍵名，綁定值為對象類型時必填

string

—

value

 

所以我們要在el-select 標簽里面加上 value-key="id"（  id是選項數據的字段）

<el-select v-model="value" placeholder="請選擇" @change="getchang" value-key="id" >
        <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item">
        </el-option>
      </el-select>

 

 getchang(value) {        
      console.log("選中值的id",value.id);
      console.log("選中值的name",value.name);
      },