Element plus 下拉框组件选中一个选项后显示的是 value 而不是 label

最近刚进行 Vue3 + Element plus 项目实践,在进行表单二次封装的时候,表单元素 select 下拉框组件选中一个选项后显示的是 value 而不是 label,下面上代码:

原来的写法:

<el-selectv-if="v.type === 'select'"v-model="formModel[v.id]":placeholder="v.placeholder"clearable
><el-optionv-for="(item, i) in v.option":value="item.value":key="`${i}${v.value}`">{{item.label}}</el-option>
</el-select>

这样写,选中一个选项 “是” 后,下拉框中显示的一直是 value---1,而不是 label---是,如图:

修改后的写法:

<el-selectv-if="v.type === 'select'"v-model="formModel[v.id]":placeholder="v.placeholder"clearable
><el-optionv-for="(item, i) in v.option":label="item.label":value="item.value":key="`${i}${v.value}`"/>
</el-select>

这样写,选中一个选项 “是” 后,下拉框中显示的是 label---是,而不是 value---1,如图 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/889921.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SpringBoot2+Vue2开发工作管理系统

项目介绍 在工作中使用的管理系统&#xff0c;可以随手记录一些笔记、可以汇总一些常用网站的链接、可以管理自己负责的项目、可以记录每日日报和查看历史日报、可以记录加班情况、可以记录报销内容、可以编写文章文档。 系统功能 我的笔记快捷入口项目管理今日日报我的日报…

C语言实现八大排序算法

目录 1.插入排序 1.1 直接插入排序 1.2 希尔排序 2. 选择排序 2.1 直接选择排序 2.2 堆排序 *TopK问题&#xff1a; 3. 交换排序 3.1 冒泡排序 3.2 快速排序 1. Hoare版本 2. 挖坑法 3. 前后指针法 4. 快速排序优化 5. 非递归快速排序 4.归并排序 1.递归式归并…

SpringCloudAlibaba | Sentinel从基础到进阶

一、Sentinel简介 Sentinel是SpringCloudAlibaba的一个组件&#xff0c;主要用于解决微服务架构中的高可用性和稳定性问题&#xff08;雪崩问题&#xff09;。 常见的使用场景有&#xff1a; 流量控制舱壁模式&#xff08;线程隔离&#xff09;超时处理熔断降级 二、流量控…

51c嵌入式~单片机~合集3

我自己的原文哦~ https://blog.51cto.com/whaosoft/12362395 一、STM32代码远程升级之IAP编程 IAP是什么 有时项目上需要远程升级单片机程序&#xff0c;此时需要接触到IAP编程。 IAP即为In Application Programming&#xff0c;解释为在应用中编程&#xff0c;用户自己的…

Spring Boot 集成 Elasticsearch怎样在不启动es的情况下正常启动服务

解释 在spingboot 集成es客户端后&#xff0c;每当服务启动时&#xff0c;服务默认都会查看es中是否已经创建了对应的索引&#xff0c;如果没有索引则创建。基于上面的规则我们可以通过配置不自动创建索引来达到在没有es服务的情况下正常启动服务。 解决办法 在entity类的Docu…

Linux在Ubuntu系统下安装MySQL数据库(全网最详细)

1.在ubuntu下安装MySQL数据库 第一步要先&#xff1a;切换到root用户 以我自己的为例&#xff08;自行输入密码&#xff09; ljwVM-16-16-ubuntu:~$ su - 1.1 查看操作系统版本 rootVM-16-16-ubuntu:~# lsb_release -a 1.2 添加MySQL APT源 1.2.1 访问下载⻚⾯并下载发布包…

vs code 2024编译环境问题记录

之前vs code环境配置了好一会&#xff0c;现在将遇到的问题记录一下&#xff0c;并贴上解决方法。 在这之前&#xff0c;关键的gcc编译器竟然在Python生成exe的过程中不小心下载了Mingw64&#xff0c;然后导致gcc编译器已经安装好在某个目录下了 命令行查看发现&#xff0c;原…

linux网络编程 | c | epoll实现IO多路转接服务器

epoll实现IO多路转接服务器 可通过以下视频学习 06-opell函数实现的多路IO转接_哔哩哔哩_bilibili 通过响应式–多路IO转接实现 文章目录 epoll实现IO多路转接服务器1.思路&功能核心思路 2.代码实现multi_epoll_sever.c运行图 1.思路&功能 **功能&#xff1a;**客…

植物大战僵尸辅助【控制台版本】

前面介绍了使用CE和OD的简单使用&#xff1a;CE和OD介绍和使用CE查找阳光的教学&#xff1a;阳光基地址和偏移地址&#xff0c;下面先使用最简单的控制台程序来实现修改阳光的功能。 项目地址 1.分析程序 我们的控制台程序想要修改植物大战僵尸游戏内的数据&#xff0c;它们…

elasticsearch 使用Painless脚本

文章目录 1. 创建索引2. 插入模拟数据Painless 脚本的基本特点&#xff1a;Painless 脚本的常见用途1. 脚本查询和过滤示例&#xff1a;基于脚本的查询 2. 脚本字段示例&#xff1a;脚本字段 3. 聚合中的脚本示例&#xff1a;脚本聚合 4. 文档更新中的脚本示例&#xff1a;文档…

【Elasticsearch】高亮搜索:从原理到Web呈现

&#x1f9d1; 博主简介&#xff1a;CSDN博客专家&#xff0c;历代文学网&#xff08;PC端可以访问&#xff1a;https://literature.sinhy.com/#/?__c1000&#xff0c;移动端可微信小程序搜索“历代文学”&#xff09;总架构师&#xff0c;15年工作经验&#xff0c;精通Java编…

15.初始接口1.0 C#

这是一个用于实验接口的代码 适合初认识接口的人 【CSDN开头介绍】&#xff08;文心一言AI生成&#xff09; 在C#编程世界中&#xff0c;接口&#xff08;Interface&#xff09;扮演着至关重要的角色&#xff0c;它定义了一组方法&#xff0c;但不提供这些方法的实现。接口作为…

Day9 神经网络的偏导数基础

多变量函数与神经网络 在神经网络中&#xff0c;我们经常遇到多变量函数。这些函数通常描述了网络的输入、权重、偏置与输出之间的关系。例如&#xff0c;一个简单的神经元输出可以表示为&#xff1a; z f ( w 1 x 1 w 2 x 2 … w n x n b ) z f(w_1x_1 w_2x_2 \ldots…

map和set题目练习

一、习题一&#xff1a;随机链表的复制 1.1题目详情 1.2思路 在没有学习map和set之前&#xff0c;解决这道题最大的问题就在于无法建立原链表与拷贝链表的映射关系&#xff0c;只能通过在原链表每个节点后面新建一个新的链表来进行节点间的对应&#xff0c;而学习了map之后&a…

C语言入门(一):A + B _ 基础输入输出

前言 本专栏记录C语言入门100例&#xff0c;这是第&#xff08;一&#xff09;例。 目录 一、【例题1】 1、题目描述 2、代码详解 二、【例题2】 1、题目描述 2、代码详解 三、【例题3】 1、题目描述 2、代码详解 四、【例题4】 1、题目描述 2、代码详解 一、【例…

渗透测试学习笔记(五)网络

一.IP地址 1. IP地址详解 ip地址是唯一标识&#xff0c;一段网络编码局域网&#xff08;内网&#xff09;&#xff1a;交换机-网线-pcx.x.x.x 32位置2进制&#xff08;0-255&#xff09; IP地址五大类 IP类型IP范围A类0.0.0.0 到 127.255.255.255B类128.0.0.0 到191.255.25…

《自制编译器》--青木峰郎 -读书笔记 编译hello

在该书刚开始编译hello.cb时就遇到了问题。 本人用的是wsl&#xff0c;环境如下&#xff0c; 由于是64位&#xff0c;因此根据书中的提示&#xff0c;从git上下载了64位的cb编译器 cbc-64bit 问题一: 通过如下命令编译时,总是报错。 cbc -Wa,"--32" -Wl,"-…

jedis使用及注意事项

Jedis Jedis 是一个 Java 客户端&#xff0c;用于与 Redis 数据库进行交互。它提供了一系列简单易用的 API&#xff0c;使得在 Java 应用程序中使用 Redis 变得非常方便。以下是 Jedis 的使用方法及一些注意事项。 Jedis的优势 Lettuce客户端及Jedis客户端比较如下&#xff1a;…

浏览器执行机制

主线程 任务1&#xff0c;任务2 微队列微队列任务1&#xff0c; 微队列任务2延时队列延时队列任务1&#xff0c; 延时队列任务2交互队列.... 事件循环的工作原理 主线程执行同步任务&#xff1a; 主线程首先执行所有同步任务&#xff08;即栈中的任务&#xff09;。这些任务会…

Java 基础知识——part 4

8.成员方法&#xff1a;Java中必须通过方法才能对类和对象的属性操作&#xff1b;成员方法只在类的内部声明并加以实现。一般声明成员变量后再声明方法。 9.方法定义 方法的返回值是向外界输出的信息&#xff0c;方法类型和返回值类型同&#xff1b;返回值通过return返回&…