el-select获取选中label值
原文链接: https://blog.csdn.net/m0_38038870/article/details/123418588
1.用Arry.find方法
<el-select v-model="value" placeholder="请选择" @change="getLabel">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
getLabel(value) {
console.log(value);
let obj = {};
obj = this.options.find((item)=>{
return item.value === value;
});
console.log(obj.label);
}
2.通过绑定原生click事件来进行传参
<el-select v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" @click.native="labelClick(item.label)">
</el-option>
</el-select>
labelClick(data){
console.log(data);
}
3.通过 $refs 拿到 el-select 组件实例,该实例拥有 selectedLabel 属性,为当前选中的 label。
或者可以通过 selected 拿到选中的 option 的组件实例,拥有 label 和 value 两个属性。
<el-select ref="selectLabel" v-model="value" placeholder="请选择" @change="getLabel">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
getLabel(){
this.$nextTick(()=>{
console.log(this.$refs.selectLabel.selectedLabel);
console.log(this.$refs.selectLabel.selected.label);
})
}
相关文章
- php 获取淘宝搜索词 内容
- jquery获取当前select下拉选的属性值
- .net 获取网站根目录总结
- 成功获取并更改中兴F660光猫的超级用户密码解除四台限制
- Selenium webdriver 获取属性值 元素里的value
- view--4种Android获取View宽高的方式
- 获取选中的选项卡的名称
- 前端获取元素定位位置的法宝
- node.js 获取url中的各个参数
- Atitit.获取approot api 应用根路径 java c#.net php asp
- 树形下拉选择框el-select结合el-tree-回显和获取值效果demo(整理)
- Python语言学习:创建/删除文件/文件夹、获取当前文件/文件夹路径(系统环境路径/目录)、获取当前文件夹下的所有子文件路径等代码(os系列用法)实现之详细攻略
- Android 获取当前默认时区
- Android设备唯一识别码的获取
- java中如何获取项目的路径
- 猫眼电影获取票房信息
- java通过反射获取私有的构造方法,及反射擦除泛型数据类型约束
- jquery 获取和设置 checkbox radio 和 select option的值?
- Win11管理员权限怎么获取?Win11管理员权限开启的方法
- Kinect for Windows V2和V1对照开发___深度数据获取并用OpenCV2.4.10显示
- jquery获取select标签的选中元素(整理)
- Android App层通过JNI从驱动获取Input Event