记录element-ui select获取item对象以及解决回显问题_el-select选择对象回显

1、el-option的  :value="item"  需要绑定当前的对象；

2、el-select   value-key="id"   这里我绑定的是item的id

3、由于获取详情时后台返回的数据是object，所以我将对应的字段提取出来，进行赋值回显；

<el-form-item label="品牌" prop="brandObj">
  <el-select
    v-model="brandObj"
    filterable
    value-key="id"
    placeholder="请选择"
    @change="changeBrand"
  >
    <el-option
      v-for="item in brandData"
      :key="item.id"
      :value="item"
      :label="item.title"
     />
  </el-select>
 </el-form-item>
 
data() {
    return {
       //绑定的对象
       brandObj: {},
       // 循环的数据
       brandData: [
           {id: 1, title: "九阳"} 
           {id: 2, title: "海尔"}
         ],
    }
}
 
 async getGoodsDetail(id) {
      try {
        const res = await getStoreGoodsDetail({ id });
        //解构出所需要的字段
        const { brand, brand_title } = res.data;
        //将该字段进行赋值操作，就可以正常回显
        this.brandObj = {
          id: brand,
          title: brand_title,
        };
      } catch (error) {
        console.log(error);
      }
    },