[element-ui] el-dropdown 触发显示时阻止事件冒泡 .stop

如果el-tree自定义节点包含el-dropdown,为了防止点击el-dropdown的触发按钮而执行el-tree的node-click事件

最外层添加div,给div绑定事件并添加事件修饰符(stop)

<el-tree :data="treeData" @node-click="treeNodeClickEvent"><div @click.stop><el-dropdown trigger="click"><span class="el-dropdown-link"><i class="el-icon-more"></i></span><el-dropdown-menu slot="dropdown"><el-dropdown-item><i class="my-icon icon-folder"></i><span>创建文件夹</span></el-dropdown-item><el-dropdown-item><i class="my-icon icon-document"></i><span>创建文档</span></el-dropdown-item><el-dropdown-item><i class="my-icon icon-markdown"></i><span>创建Markdown</span></el-dropdown-item><el-dropdown-item><i class="my-icon icon-edit"></i><span>编辑</span></el-dropdown-item><el-dropdown-item><i class="my-icon icon-delete"></i><span>删除</span></el-dropdown-item></el-dropdown-menu></el-dropdown></div>
</el-tree>

参考:

ElementUI dropdown 触发显示时阻止事件冒泡

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

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

相关文章

学习嵌入式第二十九天

ipc进程间通信方式 PC&#xff0c;即进程间通信&#xff08;Inter-Process Communication&#xff09;&#xff0c;是操作系统中不同进程之间交换数据的一种机制。以下是一些常见的IPC方式&#xff1a; 管道&#xff1a;用于父子进程或兄弟进程之间的通信。消息队列&#xff…

nestjs nest-cli.json中的assets不生效

官方文档 Documentation | NestJS - A progressive Node.js framework // nest-cli.json{"collection": "nestjs/schematics","sourceRoot": "src","compilerOptions": {"assets": ["microservices/mail/te…

【网络编程】select实现服务器与客户端进行通信

1、运行1个服务器和2个客户端 实现效果: 1、服务器和2个客户端互相聊天&#xff0c;服务器和客户端都需要使用select模型去实现 2、服务器要监视2个客户端是否连接&#xff0c;2个客户端是否发来消息&#xff0c;以及服务器自己的标准输入流 3、客户端…

定格精彩瞬间!详解六自由度技术原理及应用

在体育赛事中&#xff0c;观赏各项目的精彩瞬间&#xff0c;欣赏运动员的卓越表现是观众们最为关注的焦点。以体操跳马为例&#xff0c;运动员们全力助跑&#xff0c;然后奋力起跳、腾空&#xff0c;接着精准的推手和转体动作&#xff0c;最后稳稳落地&#xff0c;整个动作行云…

检测到目标URL存在http host头攻击漏洞

漏洞描述 修复措施 方法一&#xff1a; nginx 的 default_server 指令可以定义默认的 server 去处理一些没有匹配到 server_name 的请求&#xff0c;如果没有显式定义&#xff0c;则会选取第一个定义的 server 作为 default_server。 server { …

avue-crud 自定义搜索项 插槽

加上 -search 就可以自定义查询项了

【MongoDB】Java连接MongoDB

连接URI 连接 URI提供驱动程序用于连接到 MongoDB 部署的指令集。该指令集指示驱动程序应如何连接到 MongoDB&#xff0c;以及在连接时应如何运行。下图解释了示例连接 URI 的各个部分&#xff1a; 连接的URI 主要分为 以下四个部分 第一部分 连接协议 示例中使用的 连接到具有…

ant design pro 中用户的表单如何控制多个角色

ant design pro 如何去保存颜色ant design pro v6 如何做好角色管理ant design 的 tree 如何作为角色中的权限选择之一ant design 的 tree 如何作为角色中的权限选择之二ant design pro access.ts 是如何控制多角色的权限的 看上面的图片 当创建或编辑一个用户时&#xff0c;…

Mac文件需要分卷压缩怎么办 Mac上怎么解压分卷压缩的文件

在处理大型文件的传输和存储的时候&#xff0c;Mac用户常面临文件大小超过限制的问题。为了有效管理这些大文件&#xff0c;分卷压缩成为一种必不可少的解决方案。Mac文件需要分卷压缩怎么办&#xff1f;Mac上怎么解压分卷压缩的文件&#xff1f;本文将向你介绍如何使用BetterZ…

第R2周:LSTM-火灾温度预测

&#x1f368; 本文为&#x1f517;365天深度学习训练营 中的学习记录博客&#x1f356; 原作者&#xff1a;K同学啊 一、什么是LSTM 1.LSTM的本质 长短时记忆网络&#xff08;Long Short-Term Memory, LSTM&#xff09;的本质是一种特殊的循环神经网络&#xff08;Recurrent…

使用Go语言将PDF文件转换为Base64编码

使用 Go 语言将 Base64 编码转换为 PDF 文件-CSDN博客本文介绍了如何使用 Go 语言将 Base64 编码转换为 PDF 文件&#xff0c;并保存到指定路径。https://blog.csdn.net/qq_45519030/article/details/141225772 在现代编程中&#xff0c;数据转换和编码是常见的需求。本文将介绍…

SX_gitlab可视化操作c语言知识_17

gitlab可视化操作技巧: Merge into current branch直接将远程wjc_GNSS分支的数据拉下来同步到本机当前的分支代码&#xff0c;执行的是合并操作&#xff0c;即多的模块会添加到本地分支&#xff0c;有冲突的地方不行得rebase覆盖才行 修改完代码先暂存更改再在暂存区写入备注&a…

网络通信要素

网络介绍 定义&#xff1a;将具有独立功能的多台计算机通过通信线路和通信设备连接起来&#xff0c;在网络管理软件及网络通信协议下&#xff0c;实现资源共享和信息传递的虚拟平台。 学习网络的目的&#xff1a; 能够编写基于网络通信的软件或程序&#xff0c;通常来说就是网…

力扣面试经典算法150题:删除有序数组中的重复项 II

删除有序数组中的重复项 II 今天的题目是力扣面试经典150题中的数组的中等难度题: 删除有序数组中的重复项 II 题目链接&#xff1a;https://leetcode.cn/problems/remove-duplicates-from-sorted-array-ii/description/?envTypestudy-plan-v2&envIdtop-interview-150 题…

时间序列分析2|ARIMA模型|SARIMA模型

ARMA模型的定阶 自相关和偏自相关系数法 通过观察样本的自相关系数(ACF)和偏自相关系数(PACF)&#xff0c;进行大体的判断 模型定阶的经验方法 截尾&#xff1a; 最初的d阶样本(偏)自相关系数明显在2倍标准差范围外95%的(偏)自相关系数都落在2倍标准差的范围以内非零自相…

【论文阅读】通用的语义-几何表征的机器人操作

文章目录 1. 【2023CoRL】A Universal Semantic-Geometric Representation for Robotic Manipulation针对痛点和贡献引言模型框架思考不足之处 2. Leveraging Locality to Boost Sample Efficiency in Robotic Manipulation摘要和结论引言模型框架实验思考不足之处 1. 【2023Co…

ES6-ES13学习笔记

目录 初识ES6 变量声明 解构赋值 对象解构 ​编辑 数组解构 ​编辑模版字符串 字符串扩展 includes() repeat() startsWith() endsWith() 数值扩展 二进制和八进制表示法 &#xff08;Number.&#xff09;isFinite()与isNaN() Number.isInteger() Math.trunc …

Leetcode JAVA刷刷站(69)x的平方根

一、题目概述 二、思路方向 在Java中&#xff0c;计算一个非负整数x的算术平方根&#xff0c;并返回其整数部分&#xff0c;你可以使用二分查找法。这是因为平方根函数是单调递增的&#xff0c;所以我们可以利用二分查找在合理的时间复杂度内找到结果。 三、代码实现 public…

Matplotlib入门与进阶:数据可视化的强大工具

Matplotlib入门与进阶&#xff1a;数据可视化的强大工具 在当今数据驱动的世界中&#xff0c;数据可视化成为了数据分析的重要一环。数据可视化不仅能够帮助开发者理解和分析数据&#xff0c;还能使数据展示更具说服力。本文将详细介绍Python中的2D绘图库——Matplotlib。通过…

Python自准直仪双筒望远镜光学ABCD矩阵行为算法

&#x1f3af;要点 &#x1f3af;平面&#xff1b;曲面&#xff1b;圆柱面&#xff1b;非球面光&#xff0c;双凸透镜&#xff1b;90 度棱镜&#xff1b;分束立方体&#xff0c;双透镜棱&#xff1b;镜分光镜光线&#xff1b;横置隔膜&#xff1b;全内反射&#xff1b;多个分束…