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

隐藏饿了么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.hqwc.cn/news/485613.html

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

相关文章

使用ffmpeg实现视频片段截取并保持清晰度

1 原始视频信息 通过ffmpeg -i命令查看视频基本信息 ffmpeg -i input.mp4 ffmpeg version 6.1-essentials_build-www.gyan.dev Copyright (c) 2000-2023 the FFmpeg developersbuilt with gcc 12.2.0 (Rev10, Built by MSYS2 project)configuration: --enable-gpl --enable-ve…

【学习笔记】数据结构与算法03:栈与队列

知识出处&#xff1a;Hello算法&#xff1a;https://www.hello-algo.com/. 文章目录 2.2 栈和队列2.2.1 「栈 stack」2.2.1.1 栈的常用操作2.2.1.2 栈的典型应用 2.2.2「队列 queue」2.2.2.1 队列的常用操作2.2.2.2 队列的典型应用 2.2.3 双向队列 「double-ended queue」2.2.3…

数据安全治理实践路线(上)

基于以上数据安全治理实践理念&#xff0c;可以按照自顶向下和自底向上相结合的思路推进实践过程。一方面&#xff0c;组织自顶向下,以数据安全战略规划为指导,以规划、建设、运营、优化为主线&#xff0c;围绕构建数据安全治理体系这一核心&#xff0c;从组织架构、制度流程、…

数据结构与算法——排序算法

目录 文章目录 前言 一.排序的基本概念 1.什么是就地排序 2.什么是内部排序和外部排序 3.什么是稳定排序 4.判定一个排序算法的是稳定的 二.插入排序算法 1.直接插入排序 1.1基本思想 1.2复杂度 1.3稳定性 1.4代码演示 2.折半插入排序 2.1基本思想 2.2性能 3.…

ubuntu20.04中配置Pyrep和CoppeliaSim

ubuntu20.04中配置Pyrep和CoppeliaSim 在Ubuntu20.04中配置 Pyrep &#xff0c;实现应用Python语言的机器人在 Vrep&#xff08;CoppeliaSim&#xff09;中的虚拟仿真 一、安装CoppeliaSim 4.1 1.1 下载适配Ubuntu20.04的CoppeliaSim 4.1软件 下载链接&#xff1a;https://…

《剑指Offer》笔记题解思路技巧优化_Part_6

《剑指Offer》笔记&题解&思路&技巧&优化_Part_6 &#x1f60d;&#x1f60d;&#x1f60d; 相知&#x1f64c;&#x1f64c;&#x1f64c; 相识&#x1f622;&#x1f622;&#x1f622; 开始刷题&#x1f7e1;1.LCR 168. 丑数—— 丑数&#x1f7e2;2. LCR 16…

SQLite 的使用

SQLite 是一个轻量级、自包含和无服务器的关系型数据库管理系统&#xff08;RDBMS&#xff09;&#xff0c;广泛应用于嵌入式系统、移动应用程序和小中型网站。它易于创建、需要的配置较少&#xff0c;并且提供了用于管理和操作数据的强大功能集。本文&#xff0c;我们将带领你…

洛谷P3371【模板】单源最短路径(弱化版)(RE版本和AC版本都有,这篇解析很长但受益匪浅)

解释一下什么叫邻接矩阵&#xff1a; 假设有以下无向图&#xff1a; 1/ \2---3/ \ / \4---5---6对应的邻接矩阵为&#xff1a; 1 2 3 4 5 6 1 0 1 1 0 0 0 2 1 0 1 1 1 0 3 1 1 0 0 1 1 4 0 1 0 0 1 0 5 0 1 1 1 0 1 6 0 0 1 0 1 0 …

日月光投控以近5亿元收购英飞凌2座封测厂 | 百能云芯

日月光投控&#xff08;ASE Group&#xff09;日前宣布&#xff0c;计划以逾人民币4.78亿元收购德国芯片大厂英飞凌&#xff08;Infineon&#xff09;旗下位于菲律宾和韩国的两座后段封测厂。这一举措旨在扩大日月光在车用和工业自动化应用的电源芯片模组封测与导线架封装方面的…

Redis 工具类 与 Redis 布隆过滤器

Redis 工具类 1. 核心依赖 <!--redis--> <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId> </dependency> <dependency><groupId>com.google.guava…

【行业交流】优积科技·国住人居与广东保利就学校、居住场景下模块化建筑技术的运用进行交流

近日&#xff0c;保利发展控股集团股份有限公司&#xff08;以下简称“保利发展”&#xff09;、 优积建筑科技发展(上海)有限公司&#xff08;以下简称“优积科技”&#xff09;、国住人居工程顾问有限公司&#xff08;以下简称“国住人居公司”&#xff09;就模块化建造体系与…

pytorch保存张量为图片

这里用到的是torchvision中的save_image。 废话不多说&#xff0c;直接来代码&#xff1a; import torch from torchvision.utils import save_image B, C, H, W 64, 3, 32, 32 input_tensor torch.randn(B, C, H, W) save_image(input_tensor, "hh.png", nrow8)…