2023213-popover弹窗框中的teleported属性--Element-plus踩坑日记

news2024/12/30 1:40:19

popover弹窗框中的teleported属性–Element plus踩坑日记

今天在做项目时,有一个地方用到了弹窗框,但是有需求需要修改弹窗的阴影部分

比如下方的

image-20230213185801885

我想对阴影进行修改,但是很是纳闷,各种标签选择器都不生效,很奇怪。

按照以往对element plus样式修改是完全没问题的。

带着疑问问了带我实习的师傅,发现了这个属性

teleported:是否将 popover 的下拉列表插入至 body 元素 默认值为true

把这个属性改为false,成功了!!! 但是为什么呢

将 popover 的下拉列表插入至 body 元素不应该也生效吗??

经过查看HTML结构,我发现了问题

这个插入body元素确实是插入了body元素中,但是它是仅是降了一级成为了body的children

它和我们组件的内容成为兄弟关系了!

如下图

image-20230213190747921

可知,弹窗框是在组件内容之外了,所以在组件内操作的样式没有对弹窗框生效

而改为false之后就成为下面的效果了

image-20230213191109825

而样式也成功生效

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

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

相关文章

使用地理定位来自定义网络钓鱼

在全球市场中,地理定位的能力是巨大的。 从本质上讲,这意味着企业可以根据收件人的位置定制广告。 纽约人可能会收到与法国人不同的广告。这使得广告对企业更有价值,对消费者来说更个性化。 还有另一群人想要个性化他们的产品:…

2023年要跟踪的11个销售管理关键指标

销售管理关键指标有:营销合格线索数量(MQL)、MQL 到 SQL 的转换率、商机赢单率、获客成本、总销售额、客户终身价值(LTV)、LTV 与 CAC 比率、赢单周期、每客户平均销售额(平均客单价)、每销售人…

全球十大资质正规现货黄金交易平台排名榜单(最新版汇总)

如今,在金融市场上,黄金已经成为公众喜爱的避险产品,尤其是近年来出现的现货黄金,这是许多朋友日常财务管理的标准。但我们在参考黄金交易平台排名进场时,需要留意哪些因素? 1、交易模式 事实上&#xf…

软件测试 -- 高阶 2 软件测试与软件开发

辅车相依,唇亡齿寒。-- 《左传僖公五年》 释译:颊骨和齿床互相依靠,嘴唇没有了,牙齿就会感到寒冷。比喻利害密要相关,命运紧密相关联。-- 百度百科 测试与开发是什么关系? 1. 软件开发流程 2. 开发和测…

AcWing 167. 木棒(DFS + 剪枝优化)

AcWing 167. 木棒(DFS 剪枝优化)一、问题二、分析1、整体分析2、剪枝优化(1)优化搜索顺序(2)排除等效冗余(3)可行性剪枝(4)最优性剪枝(5&#xf…

ASEMI低压MOS管AO3401封装,AO3401图片

编辑-Z ASEMI低压MOS管AO3401参数: 型号:AO3401 封装:SOT-23 漏极-源极电压(VDS):30V 栅源电压(VGS):12V 连续漏电流(I):4.2A …

K_A12_004 基于STM32等单片机采集人体红外感应(HC-SR501)模块串口与OLED0.96双显示

K_A12_004 基于STM32等单片机采集人体红外感应(HC-SR501)模块串口与OLED0.96双显示一、资源说明二、基本参数参数引脚说明三、驱动说明模块工作原理:对应程序:四、部分代码说明1、接线引脚定义1.1、STC89C52RCHC-SR501模块1.2、STM32F103C8T6HC-SR501模块…

docker-compose概述与简单编排部署

一、Docker-compose 简介Docker-Compose项目是基于Python开发的Docker官方开源项目,负责实现对Docker容器集群的快速编排。Docker-Compose将所管理的容器分为三层,分别是 工程(project),服务(service&#…

MySQL学习笔记——CSDN学习记录九:数据库存储引擎

存储引擎 一、MySQL 体系结构: 二、存储引擎概念: MySQL 中的数据用于各种不同的技术存储在文件或内存。这些技术的每一个都使用不同的存储机制、索引技巧、锁定水平,最终提供不同的功能。通过选择不同的技术,能够得到更好的数据处…

03- SVC 支持向量机做人脸识别 (项目三)

数据集描述: sklearn的lfw_people函数在线下载55个外国人图片文件夹数据集来精确实现人脸识别并提取人脸特征向量数据集地址: sklearn.datasets.fetch_lfw_people — scikit-learn 1.2.1 documentationPCA降维: pca PCA(n_components0.9) 数据拆分: X_train, X_test, y_tra…

正大期货本周财经大事抢先看

美国1月CPI、Fed 等央行官员谈话 美国1月超强劲的非农就业人口,让投资人开始上修对这波升息循环利率顶点的预测,也使本周二 (14 日) 的美国 1月 CPI 格外受关注。 介绍正大国际期货主账户对比国内期货的优势 ​第一点:权限都在主账户 例如…

B站基于缓存优化 PRESTO 集群查询性能

导读:本次分享主题为 B 站 Presto 集群查询性能的优化,首先会简单介绍 Presto以及 B 站内部 Presto 集群的架构。接下来讲解针对 Presto 做的改造,主要是 Presto 搭配 Alluxio 和 Presto 搭配 Alluxio local cache 的使用。最后会对后续计划开…

C++类基础(十三)

类的继承 ● 通过类的继承(派生)来引入“是一个”的关系( 17.2 — Basic inheritance in C) – 通常采用 public 继承( struct V.S. class ) – 注意:继承部分不是类的声明 – 使用基类的指针…

StarRocks技术内幕 | 资源隔离原理解析

资源隔离一直是 StarRocks 用户讨论较多的话题,对于资源隔离的诉求,主要集中在四点:1. 很多用户关注资源的隔离性,期望当有核心业务的查询运行时,可以限制其他类型任务的使用资源,进而保障核心业务的响应时…

SpringMVC(1)

Web项目:基于HTTP协议,当一个用户从浏览器上面输入URL地址之后,URL能够和我们的程序映射起来,可以让用户的请求触达到后端程序里面,并且根据程序的处理,把结果返回浏览器; Spring MVC要进行学习的内容: 1)连…

三分钟学习 Gitee OpenAPI

文章目录1 什么是 Gitee Open API ?2 如何操作Open API ?2.1 申请私人令牌2.2 发起网络请求3 其他Git Open API3.1 Github Open API3.2 Gitlab OpenAPI1 什么是 Gitee Open API ? 简单说就是 网络请求 Open API 让我们可以通过网络请求的方式对 Git仓库的 分支&#xff0…

LinkedList与链表(数据结构系列5)

目录 前言: 1.链表的概念以及分类 1.1链表的概念 1.2分类 1.2.1单向和双向 1.2.2循环和非循环 1.2.3带头和不带头 2.无头单链表的模拟实现 3.双向链表的模拟实现 4.LinkedList的简单介绍 5.LinkedList的遍历 5.1直接打印 5.2for-each遍历 5.3迭代器遍历…

【Vercel】教你部署imsyy/home个人主页

本篇博客教你如何部署一个自己的个人主页 项目地址:https://github.com/imsyy/home 本文首发于 慕雪的寒舍 1.fork仓库vercel部署 首先我们点击fork,将仓库复刻到自己的账户 随后进入vercel,点击dashboard-add new-project 选择你复刻的仓库…

我的Android开发【分代收集算法】

为什么要采用分代收集算法? 分代的垃圾回收策略,是基于这样⼀个事实:不同的对象的⽣命周期是不⼀样的。因此,不同⽣命周期的对象可以采取不同的收集⽅式,以便提⾼回收效率。在 Java 程序运⾏的过程中,会产…

【大数据基础】vmware+ununtu安装详细过程

环境配置 1. 虚拟机VMware下载与安装 首先安装vmware workstation 密钥直接利用科技生成。 检查vmware是否成功安装 2. VMware安装Ubuntu18.04 LTS 在清华源镜像站找到合适版本的ubuntu 联网安装需要一些时间,大致在一到两个小…