Element Plus 的下拉选择器el-option的字体全部蓝色,全部是选中状态

news2024/11/15 8:43:42

问题

原因

参考官方:

Select 选择器 | Element Plus

解决方案1:

给外层el-select增加一个value-key指定值: value-key="ID"

<el-select value-key="ID"
  ref="productName"
  v-model="selectedProduct.GOODS_DESC" filterable remote reserve-keyword
  placeholder="请输入商品名/关键字"
  @change="handleProductChange" remote-show-suffix
  :loading="false" @visible-change='changeCustom'>
  <el-option v-for="item in list" :key="item.GOODS_DESC" :label="item.GOODS_DESC"
             :value="item"></el-option>
</el-select>

解决方案2:

给每个item添加一个value字段,值任意,这个是在开发误写value值,发现它也能解决问题。

list = res.data.map((item, index) => {
   item.value = ''
  return item
})

 最终效果

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

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

相关文章

eCharts图表点击事件(柱形、label),获取选择项的下标及值

获取选则项的值的话&#xff0c;打印params就能找到了&#xff0c;故主要说明找到对应下标的情况。 柱形点击事件 简单代码 this.myChart echarts.init(this.$refs.chartbox1); this.myChart.off("click"); this.myChart.on("click", (params) > {c…

4.4 MySQL存储1

1、使用前提 安装MySQL数据库&#xff0c;安装pymysql第三方库。 2、使用连接数据库最初步骤 (1) 声明一个连接对象。使用connect()方法声明一个连接对象conn&#xff0c;参数为数据库的一些信息。依次为主机名、用户名、密码、端口号&#xff1b; (2) 获得游标。使用cursor…

intellij idea创建spring项目时没有java 8

一、 引入 当我们用file–》new–》project创建一个项目时&#xff0c;会遇到下面的情况(如图二所示&#xff09;&#xff0c; 图一 图二 java版本仅有21和17可选&#xff0c;而国内大部分还在用java 8 版本&#xff0c;会导致项目无法启动。 二、解决办法 点击serverUrl进…

mysql-多表查询-外连接

一、外连接查询语法 &#xff08;1&#xff09;左外连接 select 所要查询的内容 from 左表 left outer join 右表 on 条件; &#xff08;2&#xff09;右外连接 select 所要查询的内容 from 左表 right outer join 右表 on 条件; 二、示例 用以下两张表示例 左外连接 右外…

3.测试教程 - 基础篇

文章目录 软件测试的生命周期软件测试&软件开发生命周期如何描述一个bug如何定义bug的级别bug的生命周期如何开始第一次测试测试的执行和BUG管理产生争执怎么办&#xff08;处理人际关系&#xff09; 大家好&#xff0c;我是晓星航。今天为大家带来的是 测试基础 相关的讲解…

戏曲文化苑|戏曲文化苑小程序|基于微信小程序的戏曲文化苑系统设计与实现(源码+数据库+文档)

戏曲文化苑小程序目录 目录 基于微信小程序的戏曲文化苑系统设计与实现 一、前言 二、系统功能设计 三、系统实现 1、微信小程序前台 2、管理员后台 &#xff08;1&#xff09;戏曲管理 &#xff08;2&#xff09;公告信息管理 &#xff08;3&#xff09;公告类型管理…

开源免费大模型框架自己训练可根据关键词提示绘图的软件

开源免费大模型框架自己训练可根据关键词提示绘图的软件!大家都知道&#xff0c;市面上那些可以支持这种业务的大模型都是收费的&#xff0c;如果你是一个资深的大模型爱好者&#xff0c;并且有自己的打算和预算&#xff0c;想自己训练一套属于自己的大模型软件来完成日常的绘图…

什么是MapReduce

1.1 MapReduce到底是什么 Hadoop MapReduce是一个软件框架&#xff0c;基于该框架能够容易地编写应用程序&#xff0c;这些应用程序能够运行在由上千个商用机器组成的大集群上&#xff0c;并以一种可靠的&#xff0c;具有容错能力的方式并行地处理上TB级别的海量数据集。这个定…

编程学习线上提问现场解答流程,零基础学编程从入门到精通

编程学习线上提问现场解答流程 一、前言 之前给大家分享的一款中文编程工具&#xff0c;越来越多的学员使用这个工具学习编程。 在学习中有疑难问题寻求解答流程 1、可以在本平台留言或发私信联系老师 2、可以在群提问及时解答问题 3、通过线上会议的方式&#xff0c;电脑…

2024年必备原型设计工具盘点,助你成为设计大神

原型设计是 UI/UX 设计中至关重要的一步&#xff0c;就像用户体验中的其他环节一样&#xff0c;有无数的原型工具可以帮助你完成原型设计。 如果市场上有太多的原型设计工具让你不知所措&#xff0c;不知道选择哪一个&#xff0c;恭喜你&#xff0c;这个原型设计工具的集合是为…

go-zero微服务入门教程

go-zero微服务入门教程 本教程主要模拟实现用户注册和用户信息查询两个接口。 准备工作 安装基础环境 安装etcd&#xff0c; mysql&#xff0c;redis&#xff0c;建议采用docker安装。 MySQL安装好之后&#xff0c;新建数据库dsms_admin&#xff0c;并新建表sys_user&#…

openEuler安装MySQL客户端、openEuler安装MySQL-client、openEuler部署MySQL-client

MySQL客户端下载链接&#xff1a;https://downloads.mysql.com/archives/community/ mysql-community-client-5.7.30-1.el7.x86_64.rpm mysql-community-common-5.7.30-1.el7.x86_64.rpm mysql-community-libs-5.7.30-1.el7.x86_64.rpm 3个必选 8.0.22以上的版本是4个&…

个人博客系列-项目部署-nginx(3)

使用Nginx uwsgi进行部署django项目 一. 检查项目是否可以运行 启动项目 python manage.py runserver 0.0.0.0:8099输入ip:8099 查看启动页面 出现上述页面表示运行成功 二. 安装uwsgi并配置 2.1 下载uwsgi pip install uwsgi新建文件test.py写入内容&#xff0c;测试一…

Python算法题集_图论(课程表)

Python算法题集_课程表 题207&#xff1a;课程表1. 示例说明2. 题目解析- 题意分解- 优化思路- 测量工具 3. 代码展开1) 标准求解【循环递归全算】2) 改进版一【循环递归缓存】3) 改进版二【循环递归缓存反向计算】4) 改进版三【迭代剥离计数器检测】 4. 最优算法5. 相关资源 本…

GaussDB SQL调优:建立合适的索引

背景 GaussDB是华为公司倾力打造的自研企业级分布式关系型数据库&#xff0c;该产品具备企业级复杂事务混合负载能力&#xff0c;同时支持优异的分布式事务&#xff0c;同城跨AZ部署&#xff0c;数据0丢失&#xff0c;支持1000扩展能力&#xff0c;PB级海量存储等企业级数据库…

Rust之构建命令行程序(四):用TDD(测试-驱动-开发)模式来开发库的功能

开发环境 Windows 11Rust 1.75.0 VS Code 1.86.2 项目工程 这次创建了新的工程minigrep. 用测试-驱动模式来开发库的功能 既然我们已经将逻辑提取到src/lib.rs中&#xff0c;并将参数收集和错误处理留在src/main.rs中&#xff0c;那么为代码的核心功能编写测试就容易多了。我…

CSS轻松学:简单易懂的CSS基础指南

css基础 更多web开发知识欢迎访问我的专栏>>> 01-CSS初体验 层叠样式表 (Cascading Style Sheets&#xff0c;缩写为 CSS&#xff09;&#xff0c;是一种 样式表 语言&#xff0c;用来描述 HTML 文档的呈现&#xff08;美化内容&#xff09;。 书写位置&#xff1a;…

揭秘抖音自动评论软件的使用方法和步骤

**一、引言** 随着移动互联网的普及&#xff0c;抖音已经成为了人们日常生活中不可或缺的一部分。为了更好地利用抖音&#xff0c;我们今天就来探讨一下抖音自动评论软件的使用方法和步骤。本文将通过通俗易懂的语言&#xff0c;结合实际操作&#xff0c;帮助大家轻松掌握这一…

springboot网站开发0201-使用MybatisPlus查询数据库信息返回前端渲染

springboot网站开发0201-使用MybatisPlus查询数据库信息返回前端渲染&#xff01;这一次我们将会详细的展示一个完整的数据库查询案例&#xff0c;从查询数据库到返回前端渲染页面完成一个流程。 首先&#xff0c;我们需要清楚&#xff0c;本次业务需求是&#xff0c;查询新闻分…

Android 仿信号格子强度动画效果实现

效果图 在 Android 中&#xff0c;如果你想要绘制一个圆角矩形并使其居中显示&#xff0c;你可以使用 Canvas 类 drawRoundRect 方法。要使圆角矩形居中&#xff0c;你需要计算矩形的位置&#xff0c;这通常涉及到确定矩形左上角的位置&#xff08;x, y&#xff09;&#xff0…