场景:接口不仅需要传入el-select中获取的 name值,还需要获取el-select选中项中的number值
html:
<!-- 添加或修改渠道信息维度对话框 -->
<el-select v-model="cityDirector" placeholder="请选择" @change="changeHuman">
<el-option v-for="item in humanVoOptions" :key="item.number" :label="item.name" :value="item.name"/>
</el-select>
js:
// 方法一:
methods: {
// 选择el-select值时,获取对应的id值。
changeHuman(val) {
let obj = {}
// 找到选中项的整个object对象
obj = this.humanVoOptions.find(item => {
return item['name'] === val
});
// 获取对应的number属性
this.employeeId=obj.number
},
}
// 方法二:提取为公共方法,多处可直接用this.Select_str调用。
// 调用方法:this.employeeId=this.Select_str(this.humanVoOptions, 'name', name).number
// 1、定义获取element-ui 中 el-select 选中项的objetc对象 的公共方法(公共方法)。
// 2、在通过 .属性,获取对应的值。如:this.Select_str(......).number(属性)
// 3、options:el-select,v-for循环的Options数组。 valStr:需要查找的value绑定值的字符串形式。如:'name'。 val:el-select 标签中绑定的value值,如::value='item.name'
export function Select_str(options, valStr, val) {
let obj = {}
obj = options.find(item => {
return item[valStr] === val
});
// console.log(obj) //obj: 选择的那一条数据,即item,包含所有的值
return obj
}