当前位置: 首页 > news >正文

el-select如何同时获取value和label?

在element ui 中 下拉框默认获取下拉框value的值,但是有时候根据 业务需求,我们需要label值也发送给后端,在这提供一下获取value、和label 的方式

1、在给el-option绑定:value值时使用对象的方式,将value和label同时绑定到:value上面

<el-form-item label="分组名称" prop="groupName"><el-select clearable v-model="groupForm.groupName" placeholder="请选择" @change="changeSelect"><el-optionv-for="item in groupList":key="item.groupId":label="item.groupName":value="{ value: item.groupId, label: item.groupName }" />//重点来啦!</el-select></el-form-item>

定义变量:

const groupForm = ref({})
const groupList = reactive([{"groupId": "111388758751313920", "groupName": "语文分组" },{"groupId": "111388690702925824", "groupName": "数学分组" },
])

方法:

//选择分组
function changeSelect(data){
const { value, label } = datagroupForm.value.groupName = labelgroupForm.value.groupId = value
}

相关文章:

el-select如何同时获取value和label?

在element ui 中 下拉框默认获取下拉框value的值&#xff0c;但是有时候根据 业务需求&#xff0c;我们需要label值也发送给后端&#xff0c;在这提供一下获取value、和label 的方式 1、在给el-option绑定:value值时使用对象的方式&#xff0c;将value和label同时绑定到:value…...

1.初识ChatGPT:AI聊天机器人的革命(1/10)

引言 在当今的数字化世界中&#xff0c;人工智能&#xff08;AI&#xff09;正以其独特的方式重塑我们的生活和工作。其中&#xff0c;AI聊天机器人作为人机交互的前沿技术&#xff0c;已经成为企业与客户沟通、提供个性化服务的重要工具。这些机器人通过模拟人类的对话方式&a…...

API安全 | 发现API的5个小tips

在安全测试目标时&#xff0c;最有趣的测试部分是它的 API。API 是动态的&#xff0c;它们比应用程序的其他部分更新得更频繁&#xff0c;并且负责许多后端繁重的工作。在现代应用程序中&#xff0c;我们通常会看到 REST API&#xff0c;但也会看到其他形式&#xff0c;例如 Gr…...

数据结构---单向链表

单向链表 //链表的创建 Link_t *create_link() {Link_t *plink malloc(sizeof(Link_t));if(NULL plink){perror("fail plink");return NULL;}plink->phead NULL;plink->clen 0;return plink; } //头插 int push_link_head(Link_t *plink, DataType data…...

基于STM32设计的ECG+PPG人体参数测量系统(华为云IOT)(217)

文章目录 一、前言1.1 项目介绍【1】开发背景【2】项目实现的功能【3】项目硬件模块组成1.2 设计思路【1】整体设计思路【2】整体构架【3】上位机开发思路【4】ESP8266工作模式配置1.3 项目开发背景【1】选题的意义【2】可行性分析【3】参考文献【4】摘要【5】项目背景1.4 开发…...

SpringBoot教程(十五) | SpringBoot集成RabbitMq(死信队列、延迟队列)

SpringBoot教程&#xff08;十五&#xff09; | SpringBoot集成RabbitMq&#xff08;死信队列、延迟队列&#xff09; &#xff08;一&#xff09;死信队列使用场景具体用法前提示例: &#xff08;二&#xff09;延迟队列使用场景方法一&#xff1a;通过死亡队列实现方法二&…...

Dubbo依赖包

Dubbo 是一个高性能的 RPC 框架&#xff0c;用于构建分布式服务治理系统。要使用 Dubbo&#xff0c;项目中需要引入一些关键的依赖包。这些依赖包提供了 Dubbo 的核心功能、服务注册与发现、网络通信、序列化等能力。 一、Dubbo 核心依赖包 Dubbo 的核心依赖包包含了实现 RPC…...

webGIS后端程序员学习路线

webGIS后端程序员学习路线 1. GIS 基础知识 学习要点&#xff1a; 学习资源&#xff1a; 2. 后端编程基础 学习要点&#xff1a; 学习资源&#xff1a; 3. 地理数据库&#xff08;Spatial Database&#xff09; 学习要点&#xff1a; 学习资源&#xff1a; 4. 空间数…...

OpenCV绘图函数(15)图像上绘制矩形函数 rectangle()的使用

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 绘制一个简单的、粗的或填充的直立矩形。 这个函数 cv::rectangle 绘制一个矩形轮廓或一个填充的矩形&#xff0c;其两个相对的顶点分别是 pt1 和…...

从零开始,认识游戏设计师(4)体验源于设计师②

认真并仔细地揣摩你的想法 了解自己的感受并不是一件简单的事情&#xff0c;作为设计师&#xff0c;我觉得比了解玩家总体感觉的技能更重要的是你能清楚知道描述自己感受。 试想一下&#xff0c;你是否能准确描述你喜欢什么&#xff0c;你讨厌什么&#xff0c;以及为什么这样…...

周末总结(2024/09/07)

工作 人际关系核心实践&#xff1a; 要学会随时回应别人的善意&#xff0c;执行时间控制在5分钟以内 坚持每天早会打招呼 遇到接不住的话题时拉低自己&#xff0c;抬高别人(无阴阳气息) 朋友圈点赞控制在5min以内&#xff0c;职场社交不要放在5min以外 职场的人际关系在面对利…...

MySQL数据库的SQL注入漏洞解析

说明:本文仅是用于学习分析自己搭建的SQL漏洞内容和原理,请勿用在非法途径上,违者后果自负,与笔者无关;本文开始前请认真详细学习《‌中华人民共和国网络安全法》‌及其相关法规内容【学法时习之丨网络安全在身边一图了解网络安全法_中央网络安全和信息化委员会办公室】 …...

Redis进阶(七):分布式锁

在分布式系统下&#xff0c;涉及到多个节点访问同一个公共资源的情况&#xff0c;此时需要通过 锁 进行互斥控制&#xff1a;避免出现 线程安全问题。 1.分布式锁的基本实现 超卖问题&#xff1a; 解决: 采用redis实现分布式锁 可用采取&#xff1a;在购票的时候&#xff0…...

Python 中考虑 concurrent.futures 实现真正的并行计算

Python 中考虑 concurrent.futures 实现真正的并行计算 思考&#xff0c;如何将代码所要执行的计算任务划分成多个独立的部分并在各自的核心上面平行地运行。 Python 的全局解释器锁&#xff08;global interpreter lock&#xff0c;GIL&#xff09;导致没办法用线程来实现真…...

【C++多线程编程】 线程安全与对象生命周期管理

目录 类的线程安全 实现线程安全 构造函数在多线程中的安全性 析构函数多线程环境的安全 智能指针实现多线程安全 shared_ptr 非完全线程安全 shared_ptr可能导致对象生命周期延长 const引用可以减少传递shared_ptr开销 shared_ptr 智能指针块模块的优点 析构所在线程…...

【系统架构设计师-2024年-上半年】综合知识-答案及详解

更多内容请见: 备考系统架构设计师-核心总结索引 文章目录 【第1题】【第2题】【第3题】【第4题】【第5题】【第6题】【第7题】【第8题】【第9题】【第10题】【第11题】【第12题】【第13题】【第14题】【第15题】【第16~17题】【第18~19题】【第20~21题】【第22题】【第23题】…...

MATLAB 中的对数计算

在 MATLAB 中&#xff0c;计算对数是进行数学分析和科学计算的常见需求。对数运算在数据分析、信号处理和控制系统中都有广泛应用。本篇博客将详细介绍如何在 MATLAB 中进行对数计算&#xff0c;包括自然对数、常用对数以及任意底数的对数。 1. 自然对数&#xff08;以 e 为底…...

详解 HTTPS 与 TLS证书链校验

一文详解 HTTPS 与 TLS证书链校验_证书链怎么验证-CSDN博客 深入浅出 SSL/CA 证书及其相关证书文件&#xff08;pem、crt、cer、key、csr&#xff09; https://zhuanlan.zhihu.com/p/702745054...

新手做短视频素材在哪里找?做短视频素材工具教程网站有哪些?

本文将为你提供一系列新手友好的视频制作资源&#xff0c;包括素材网站和编辑工具&#xff0c;帮助你快速成为短视频领域的新星。让我们从国内知名的蛙学网开始介绍。 蛙学网&#xff1a;新手的视频素材天堂 对于短视频新手而言&#xff0c;蛙学网绝对是一个宝库。该网站提供了…...

【html】编辑器、基础、属性、标题、段落、格式化、 连接、头部、CSS、图像

目录 2.HTML编辑器 3.HTML基础 3.1 HTML标题 3.2 段落 4.HTML元素 4.1 元素语法 4.2 嵌套元素 4.3 HTML空元素 4.4 HTML提示&#xff0c;使用小写标签 5.HTML属性 5.1 属性实例 5.2 HTML 属性常用引用属性值 5.3 使用小写属性 5.4 HTML属性参考手册 6.HTML标题 6.1 HTML水…...

GHelper完整指南:免费轻量级华硕笔记本性能控制工具终极教程

GHelper完整指南&#xff1a;免费轻量级华硕笔记本性能控制工具终极教程 【免费下载链接】g-helper Lightweight, open-source control tool for ASUS laptops and ROG Ally. Manage performance modes, fans, GPU, battery, and RGB lighting across Zephyrus, Flow, TUF, Str…...

如何对比 SEO 优化公司的服务

了解 SEO 优化公司的服务 在当今数字化时代&#xff0c;SEO&#xff08;搜索引擎优化&#xff09;已经成为了企业在互联网上获得曝光和流量的重要手段。选择一家合适的SEO优化公司&#xff0c;对于提升网站排名和增加业务机会至关重要。如何对比SEO优化公司的服务呢&#xff1…...

效率倍增:用快马打造Ollama多模型对比测试工具

最近在折腾本地大模型时&#xff0c;发现Ollama虽然能方便地运行多个模型&#xff0c;但每次想对比不同模型的表现都得手动切换&#xff0c;特别影响效率。于是琢磨着做个工具来提升测试效率&#xff0c;顺便把实现过程记录下来分享给大家。 需求痛点分析 本地测试不同模型时&a…...

【Pygame】第12章 粒子系统与视觉特效实现

摘要 粒子系统是游戏特效中最常见、也最灵活的一种技术。无论是火焰、烟雾、爆炸、闪光、魔法轨迹&#xff0c;还是雨雪、星尘、能量波纹&#xff0c;很多看起来复杂的效果&#xff0c;其实都可以拆解成大量简单粒子的组合。 粒子系统的核心思想并不复杂&#xff1a;不去单独模…...

单克隆抗体如何被制备并应用于疾病治疗?

一、什么是单克隆抗体&#xff1f;其与多克隆抗体有何区别&#xff1f;单克隆抗体&#xff08;Monoclonal Antibody&#xff0c;mAb&#xff09;是指由单一B淋巴细胞克隆所产生的高度均一、仅针对某一特定抗原表位进行识别的抗体。这类抗体具有高度特异性。与之相对的是多克隆抗…...

res-downloader资源捕获完全指南:从证书配置到多平台资源下载的解决方案

res-downloader资源捕获完全指南&#xff1a;从证书配置到多平台资源下载的解决方案 【免费下载链接】res-downloader 视频号、小程序、抖音、快手、小红书、直播流、m3u8、酷狗、QQ音乐等常见网络资源下载! 项目地址: https://gitcode.com/GitHub_Trending/re/res-downloade…...

微信智能助手终极指南:零基础打造你的专属消息管家

微信智能助手终极指南&#xff1a;零基础打造你的专属消息管家 【免费下载链接】WechatBot 项目地址: https://gitcode.com/gh_mirrors/wechatb/WechatBot 你是否曾幻想过拥有一个24小时在线的微信助手&#xff0c;帮你自动回复消息、整理信息&#xff0c;让你从繁琐的…...

商家做小程序需要考虑哪些关键问题?

商家做小程序需要考虑哪些关键问题&#xff1f;在实际业务中&#xff0c;商家是否要做小程序&#xff0c;核心并不在于技术本身&#xff0c;而在于是否能够解决获客、转化与用户沉淀的问题。小程序是一种依托平台运行的轻量级应用&#xff0c;主要用于连接用户、承载交易与优化…...

Beyond Compare 5完整激活指南:三步解决评估期错误并获取专业版授权

Beyond Compare 5完整激活指南&#xff1a;三步解决评估期错误并获取专业版授权 【免费下载链接】BCompare_Keygen Keygen for BCompare 5 项目地址: https://gitcode.com/gh_mirrors/bc/BCompare_Keygen 当你打开Beyond Compare 5时看到"评估模式错误 - 缺少评估信…...

如何用OpenRPA实现企业级流程自动化?开源RPA工具完整指南

如何用OpenRPA实现企业级流程自动化&#xff1f;开源RPA工具完整指南 【免费下载链接】openrpa Free Open Source Enterprise Grade RPA 项目地址: https://gitcode.com/gh_mirrors/op/openrpa 在数字化转型浪潮中&#xff0c;企业面临着效率瓶颈与成本压力的双重挑战。…...