el-select使用中传多个参数

在使用el-select时，会默认传参数value

<el-form-item label="项目名称" labelWidth="70px">
    <el-select v-model="ID" placeholder="请选择项目"  @change="initProjectChoice">
        <el-option v-for="(item) in proAndIdData" :key="item.project_id" :label="item.project_name"  :value="item.project_id">
        </el-option>
    </el-select>
</el-form-item>

而实际使用中，可能会用到需要传多个参数,比如我需要中item中的其他信息传递过来，并根据实际业务场景进行使用，这时可以将用value来传递整个item对象；

但是就会发现另外一个问题在下拉列表中展示为ID，不展示labal的内容；

原因是由于的v-model的类型和value的类型不一致导致，修改v- model的类型与value的类型一致后，正常显示了，还会存在另一个问题，选择后ID变了，但是列表的内容没有变化增加。

但是因为双向绑定的是一个object对象，下拉菜单每个选项总不能显示一个对象吧，所以需要一个value-key属性指定选项显示的值。

value-key="project_id" 

这样每次选中的就是selectedObject对象，然后value-key="id"的意思是通过selectedObject.id来匹配projectinfo.project_id，成功匹配到projectinfo后，选项显示projectinfo.project_name

最终修改后如下图，完全可以正常展示了。

<el-form-item label="项目名称" labelWidth="70px">
    <el-select v-model="projectinfo" placeholder="请选择项目"  value-key="project_id" @change="initProjectChoice">
        <el-option v-for="(item) in proAndIdData" :key="item.project_id" :label="item.project_name"  :value="item">
        </el-option>
    </el-select>
</el-form-item>

https://www.csdn.net/tags/MtTaMg1sODgyMTI0LWJsb2cO0O0O.html