隐藏饿了么el-select组件的el-select-dropdown部分,只使用el-select的显示框

news2024/9/22 15:25:47

隐藏饿了么el-select组件的el-select-dropdown部分,只使用el-select的显示框

问题: 由于el-select组件的el-select-dropdown部分是自动插入在最外层Body上的,所以在当前组件的scoped中让el-select-dropdown组件display:none不会生效所以需要:

:popper-append-to-body="false"

完整html代码

 <el-select v-model="value1" multiple placeholder="请选择" :popper-append-to-body="false">
    </el-select>

于是el-select-dropdown部分就没有插入了最外层body而是和el-select组件中的input也就是显示已选值的框并列
在这里插入图片描述
这时候再设置css:

 ::v-deep  .el-select-dropdown {
    display: none !important;
  }

.el-select-dropdown 就成功隐藏了 !

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

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

相关文章

企业数字化转型必备:大数据如何助力企业腾飞?

随着数字技术的迅猛发展&#xff0c;企业数字化转型已经成为一种不可逆转的趋势。在这个过程中&#xff0c;大数据扮演了至关重要的角色。那么&#xff0c;大数据究竟如何助力企业腾飞呢&#xff1f;接下来&#xff0c;我们将从多个角度深入剖析。 一、大数据助力企业精准决策 …

【MySQL】数据库索引详解 | 聚簇索引 | 最左匹配原则 | 索引的优缺点

创作不易&#xff0c;本篇文章如果帮助到了你&#xff0c;还请点赞 关注支持一下♡>&#x16966;<)!! 主页专栏有更多知识&#xff0c;如有疑问欢迎大家指正讨论&#xff0c;共同进步&#xff01; &#x1f525;c系列专栏&#xff1a;C/C零基础到精通 &#x1f525; 给大…

糖尿病性视网膜病变(DR)的自动化检测和分期

糖尿病性视网膜病变&#xff08;DR&#xff09;的自动化检测和分期 提出背景DR的阶段及其特征 历年解法计算机视觉方法多分类方法 新的解法深度学习方法迁移学习大模型多模型集成全流程分析 总结特征1&#xff1a;图像分割特征2&#xff1a;疾病分级特征3&#xff1a;治疗建议生…

邻接矩阵乘法 最短距离

问题一 最短距离 先从一个问题说起&#xff0c;输入 [4, 1, 4, 6, 4, 0, 6]代表依赖关系&#xff0c;从1开始&#xff0c;0代表ROOT节点。第二个元素为1代表第二个term在依赖树上的父节点为第1个term。​ 输出​ [[0 1 0 0 0 0 0]​ [0 0 0 0 0 0 0]​ [0 0 0 0 0 0 0]​ [1 …

【Java从入门到精通】Java Character 类

Java Character 类 Character 类用于对单个字符进行操作。 Character 类在对象中包装一个基本类型 char 的值 实例 char ch a;// Unicode 字符表示形式 char uniChar \u039A; // 字符数组 char[] charArray { a, b, c, d, e }; 然而&#xff0c;在实际开发过程中&#xf…

STM32—触摸键

目录 1 、 电路构成及原理图 2 、编写实现代码 3、代码讲解 4、烧录到开发板调试、验证代码 5、检验效果 此笔记基于朗峰 STM32F103 系列全集成开发板的记录。 1 、 电路构成及原理图 触摸键简单的了解就是一次电容的充放电过程。从原理图可以看出&#xff0c;触摸键 …

ORACLE数据库OCP认证

OCP证书是什么&#xff1f; OCP&#xff0c;全称Oracle Certified Professional&#xff0c;是Oracle公司的Oracle数据库DBA&#xff08;Database Administrator&#xff0c;数据库管理员)认证课程。这是Oracle公司针对数据库管理领域设立的一项认证课程&#xff0c;旨在评估和…

分类预测 | Matlab实现CWT-DSCNN-MSA基于时序特征、cwt小波时频图的双流卷积融合注意力机制的分类预测

分类预测 | Matlab实现CWT-DSCNN-MSA基于时序特征、cwt小波时频图的双流卷积融合注意力机制的分类预测 目录 分类预测 | Matlab实现CWT-DSCNN-MSA基于时序特征、cwt小波时频图的双流卷积融合注意力机制的分类预测分类效果基本描述程序设计参考资料 分类效果 基本描述 1.Matlab…

查询数据库的编码集Oracle,MySQL

1、查询数据库的编码集Oracle,MySQL 1.1、oracle select * from v$nls_parameters where parameterNLS_CHARACTERSET; 查询版本&#xff1a;SELECT * FROM v$version 2、MySQL编码集 SELECT DEFAULT_CHARACTER_SET_NAME, DEFAULT_COLLATION_NAME FROM information_schema.SC…

汇编语言movs指令学习

字符串传送指令(Move String Instruction) movs 该指令是把指针DS:SI所指向的字节、字或双字传送给指针ES:DI所指向内存单元&#xff0c;并根据标志位DF对寄存器DI和SI作相应增减。该指令的执行不影响任何标志位。 记不清这指令是8086就有的&#xff0c;还是386以后新加的&…

洛谷C++简单题小练习day18—牛奶数字游戏,拿放大镜看杂志暴力算法

day18--牛奶数字游戏--2.22 习题概述 题目描述 奶牛们在玩一种数字游戏&#xff0c;Bessie 想让你帮她预测一下结果。游戏开始时&#xff0c;Bessie 将得到一个正整数 N。此时她的分数为 0。 奶牛们按照以下规则对 N 进行变换&#xff1a; 如果 N 是奇数&#xff0c;那么将…

智能科技助力服装业:商品计划管理系统的革命性变革

随着智能科技的飞速发展&#xff0c;服装行业正在经历前所未有的变革。在这股浪潮中&#xff0c;商品计划管理系统的智能化转型成为了行业的核心驱动力。这种变革不仅极大地提高了服装企业的运营效率和市场竞争力&#xff0c;更为整个行业的可持续发展注入了新的活力。 智能商…

ChatGPT 是什么

文章目录 一、ChatGPT 是什么二、ChatGPT的发明者三、ChatGPT的运作方式四、ChatGPT的技术五、ChatGPT的优势六、ChatGPT的局限性七、ChatGPT的应用八、ChatGPT的未来九、总结 一、ChatGPT 是什么 OpenAI的ChatGPT&#xff0c;即Chat Generative Pre-Trained Transformer&…

java数据结构与算法刷题-----LeetCode257. 二叉树的所有路径

java数据结构与算法刷题目录&#xff08;剑指Offer、LeetCode、ACM&#xff09;-----主目录-----持续更新(进不去说明我没写完)&#xff1a;https://blog.csdn.net/grd_java/article/details/123063846 解题思路 直接使用深度优先遍历每次都将结点记录到路径字符串中如果当前结…

R语言数据分析(三)

R语言数据分析&#xff08;三&#xff09; 文章目录 R语言数据分析&#xff08;三&#xff09;一、可视化步骤1.1 创建ggplot1.2 添加美学和图层1.3 简化代码 二、可视化分布2.1 分类变量2.2 数值变量 三、可视化关系3.1 数值变量和分类变量3.2 两个分类变量3.3 两个数值变量3.…

六.生成makefile文件 并基于makefile文件编译opencv

1.点击【Generate】 生成makefile文件 2.进入目录下编译opencv源码&#xff0c;mingw32-make -j 8 3..编译出现报错 4.取消[WITH_OPENCL_D3D11_NV]选项&#xff0c;再次【configure】【generate】 然后再次编译&#xff1a;mingw32-make -j 8

开源模型应用落地-工具使用篇-获取文本向量(五)

一、前言 在之前学习的"开源模型应用落地-工具使用篇"系列文章中&#xff0c;我们已经学会了如何使用向量数据库。然而&#xff0c;还有一个问题一直未解决&#xff0c;那就是如何处理文本向量。在本文中&#xff0c;我们将继续深入学习关于向量的知识&#xff0c;特…

缓存篇—缓存雪崩

什么是缓存雪崩 通常我们为了保证缓存中的数据与数据库中的数据一致性&#xff0c;会给 Redis 里的数据设置过期时间&#xff0c;当缓存数据过期后&#xff0c;用户访问的数据如果不在缓存里&#xff0c;业务系统需要重新生成缓存&#xff0c;因此就会访问数据库&#xff0c;并…

Docker后台启动镜像,如何查看日志信息

执行 docker run -d -p 9090:8080 core-backend-image 命令后&#xff0c;Docker 会在后台运行一个新的容器实例&#xff0c;并映射宿主机的 9090 端口到容器的 8080 端口。要查看启动的容器日志&#xff0c;您需要先获取容器的 ID 或名称&#xff0c;然后使用 docker logs 命令…

如何设置路由器的端口映射?

路由器端口映射是一种常用的网络配置方式&#xff0c;可以将外部网络请求转发到内部网络上的指定设备。通过设置端口映射&#xff0c;我们可以实现远程访问局域网内的设备&#xff0c;使其在任何网络环境下都可以被访问。本文将介绍如何设置路由器的端口映射&#xff0c;以便实…