Element Plus el-dropdown append-to 挂载到父元素,但是不生效的问题 版本Element Plus版本号2.13.2问题现象开发中使用el-dropdown悬浮展开下拉菜单时append-to已经绑定了父元素但是el-dropdown内容依旧挂载到body元素上原因el-dropdown默认开启teleportedtrue下拉 DOM 被挂载到body。如果想要append-to生效那么需要手动设置teleportedfalse简单 Demo文件代码template div classlist-wrap div classlist-item v-foritem in list :keyitem.id :refel domMap.set(item.id, el) span classtitle{{ item.name }}/span !-- 关键核心三属性 -- el-dropdown triggerhover :teleportedfalse :append-todomMap.get(item.id) span classmore-btn···/span template #dropdown el-dropdown-menu el-dropdown-item编辑/el-dropdown-item el-dropdown-item删除/el-dropdown-item /el-dropdown-menu /template /el-dropdown /div /div /template script setup langts import { ref } from vue const list ref([ { id: 1, name: 测试条目1 }, { id: 2, name: 测试条目2 }, ]) // 存储每个item dom供 append-to 使用 const domMap new Mapstring, HTMLElement() /script style scoped .list-wrap { width: 300px; margin: 50px auto; } .list-item { position: relative; display: flex; align-items: center; justify-content: space-between; height: 36px; padding: 0 12px; border-radius: 6px; cursor: pointer; } .list-item:hover { background: #f5f7fa; } .more-btn { color: #666; padding: 0 6px; } .list-item:hover .more-btn { color: #1989fa; } /style

相关新闻

最新新闻

BepInEx启动失败:系统性诊断与修复指南

BepInEx启动失败:系统性诊断与修复指南

1. 项目概述:当BepInEx启动失败时,我们到底在解决什么?如果你正在为Unity游戏制作Mod,或者管理一个依赖BepInEx的插件生态,那么“BepInEx启动失败”这个报错,大概率是你开发路上的一块绊脚石。它不像一个普…

2026/7/13 4:34:50
锂电池组主动平衡方案与BQ25887应用实践

锂电池组主动平衡方案与BQ25887应用实践

1. 项目背景与核心器件选型在锂电池组应用中,电池单元之间的电压不平衡是影响系统性能和寿命的关键问题。当多个电池串联时,由于制造工艺差异、温度分布不均等因素,各单体电池的充放电特性会出现偏差。这种不平衡会导致部分电池过充或过放&am…

2026/7/13 4:34:50
MCP3428与PIC18F86K22高精度数据采集系统设计

MCP3428与PIC18F86K22高精度数据采集系统设计

1. 为什么选择MCP3428与PIC18F86K22组合在工业现场和实验室环境中,数据采集系统的精度和稳定性往往直接决定最终数据的可靠性。MCP3428作为一款18位Δ-Σ ADC(模数转换器),其核心优势在于集成了可编程增益放大器(PGA)和内部基准电…

2026/7/13 4:34:50
Google VR SDK for Unity 实战指南:从Cardboard开发到现代VR技术迁移

Google VR SDK for Unity 实战指南:从Cardboard开发到现代VR技术迁移

1. 项目概述:为什么现在还要学一个“已归档”的SDK?看到“Google VR SDK for Unity”这个标题,很多朋友可能会一愣:这不是那个已经停止维护的Cardboard和Daydream的SDK吗?没错,官方仓库在2019年就归档了&am…

2026/7/13 4:34:50
脚手架架构设计_小白版

脚手架架构设计_小白版

🏗️ 脚手架架构设计——小白完全版原文:脚手架架构设计.md 来源:Day21 课程笔记 本版目标:零基础看懂架构演进、Base 模块、Redis、Minio 等概念📌 一句话先搞懂:什么是"脚手架"? 脚…

2026/7/13 4:34:50
四大Python EDA加速工具实战指南:告别重复性数据探索

四大Python EDA加速工具实战指南:告别重复性数据探索

1. 项目概述:为什么EDA总在“重复造轮子”上卡住手脚?做数据分析的人,几乎都经历过这种时刻:刚拿到一份新数据,满心期待地打开Jupyter Notebook,敲下import pandas as pd,接着是df.head()、df.i…

2026/7/13 4:29:49

月新闻