首页 > 其他分享 >Element Plus el-select el-tree-select 获取选中的label值

Element Plus el-select el-tree-select 获取选中的label值

时间:2024-01-26 19:23:06浏览次数:25  
标签:el tree value label 选中 itemObj select

select 下拉框通过 @change 选择改变,轮巡方式根据id取name的值 

<el-form-item label="企业类型" prop="entTypeId"> <el-select v-model="form.entTypeId" placeholder="请选择企业类型" style="width: 220px" @change="entTypeChange"> <el-option v-for="dict in exam_ent_type" :key="dict.value" :label="dict.label" :value="dict.value" ></el-option> </el-select> </el-form-item>

 

//select下拉框取lable值
const entTypeChange = (val:any) => {
   //获取select的方法
   const itemObj= exam_ent_type.value.find((item:any)=>{
    return item.value === val;
  });
  console.log(itemObj);
  console.log(itemObj.label)
  form.value.areaName=itemObj.label;
};
通过@node-click选中节点方式获取选中的值

<el-form-item label="所属地区" prop="areaId"> <el-tree-select v-model="form.areaId" :data="areaOptions" :props="{ value: 'id', label: 'label', children: 'children' }" value-key="id" placeholder="请选择所属地区" check-strictly default-expand-all style="width: 220px" @node-click="handleAreaNodeClick" /> </el-form-item>

 

//area所属区域选中,取区域名称
const handleAreaNodeClick = (data: any) => {
  form.value.areaName=data.label;
  console.log(data.label)
}

 

标签:el,tree,value,label,选中,itemObj,select
From: https://www.cnblogs.com/wuzexin/p/17990529

相关文章

  • Hello 2024
    AWalletExchange题目大意Alice有a个硬币,Bob有b个硬币,双方轮流进行以下操作:1.与对方交换硬币,或者保留现有硬币.2.取出一个硬币无法进行操作的人判定为输,总是从Alice开始操作问:哪位获得胜利解题思路我们可以把游戏看作是轮流取硬币,取得最后一个硬币的为胜利那......
  • Cybellum—信息安全测试工具
    产品概述    由于软件和数据在汽车上的使用越来越多,汽车越来越“智能化”,汽车行业面临着重大的信息安全挑战。2021年8月,ISO/SAE21434正式发布,标准中对汽车的信息安全提出了规范化的要求,汽车信息安全不容忽视。     Cybellum是一款信息安全测试与管理工具,帮助汽车OE......
  • [office] excel表格间距如何设置
    excel的单元格是默认大小的,如果输入的语句太长就会被隐藏起来,看起来十分美观,并且要用的时候也很麻烦,下面让小编为你带来excel表格间距的设置方法。excel表格间距设置步骤:要修改Excel的行间距,首先要选择需要改动的单元格,但是不能单独选择一个单元格,要选择Excel最左侧的......
  • IntelliJ Idea使用技巧
    1.先设置成macOS上的VSCode快捷键映射。 2.帮助->更改内存设置->设置8192可以不怎么卡 3. 本地idea依赖proto文件生成的类飘红:1.安装protobuf插件,使用protobuf插件编译下2. 将proto目录标记为源代码根目录3.帮助中编辑Idea自定义属性......
  • 根据后端接口获取文件流下载Excel文件 分别通过GET和POST请求实现(★★★
    POST携带参数请求文件流并保存为Excel文件//payload携带的对象参数functiondownloadExcel(payload){letxhr=newXMLHttpRequest();xhr.open('POST','background/baseInfo/export',true);xhr.setRequestHeader('Content-Type','application/j......
  • el-input el-tree组件 问题:blur先于click触发怎么解决
    页面构造 使用mousedowm触发比blur更早,因为是组件所以得使用native,prevent阻止默认事件然后this.$refs.parentInput.focus();让焦点保持,点击展开或关闭箭头时候让焦点存在,点击节点的时候让页面关闭要兼容筛选效果,做了一个临时tempNode用于存放之前选择的对象,这样当在未进......
  • Cybellum—信息安全测试工具
    产品概述    由于软件和数据在汽车上的使用越来越多,汽车越来越“智能化”,汽车行业面临着重大的信息安全挑战。2021年8月,ISO/SAE21434正式发布,标准中对汽车的信息安全提出了规范化的要求,汽车信息安全不容忽视。    Cybellum是一款信息安全测试与管理工具,帮助汽车O......
  • The artifact mysql:mysql-connector-java:jar:8.0.33 has been relocated to com.mys
    Theartifactmysql:mysql-connector-java:jar:8.0.33hasbeenrelocatedtocom.mysql:mysql-connector-j:jar:8.0.33:MySQLConnector/Jartifactsmovedtoreverse-DNScompliantMaven2+coordinates.1.异常信息Theartifactmysql:mysql-connector-java:jar:8.0.33hasb......
  • Excel 拖动复制公式不改变单元格的相对坐标
    Excel的公式中,如果标记了单元格的坐标。那么在拖动复制公式到其他的单元格的时候,公式里面的单元格的坐标会相对的发生变化。但是有的时候我们需要引用固定单元格上的值,不希望这些坐标发生变化,此时需要在坐标前面加‘$’号,将坐标固定,需要固定行或者列,都可以单独的在行或者列前面加......
  • selenium介绍及编写用例
    Selenium 是一个用于自动化测试Web应用程序的工具集。它可以模拟用户在浏览器中的操作,例如点击按钮、填写表单、登录等。Selenium支持多种浏览器,包括 Chrome、Firefox、IE等,并提供了多种编程语言的API,例如 Python、Java、C#等。使用Selenium,开发人员可以编写自动化测试脚......