您的位置:首页 > 文旅 > 美景 > [element-ui] el-dropdown 触发显示时阻止事件冒泡 .stop

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

2024/10/6 8:21:49 来源:https://blog.csdn.net/qq_14993591/article/details/141311602  浏览:    关键词:[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 触发显示时阻止事件冒泡

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com