element-ui框架 el-dropdown-menu组件 绑定click事件

最新推荐文章于 2024-09-21 18:50:16 发布
最新推荐文章于 2024-09-21 18:50:16 发布
阅读量1.4k 收藏
点赞数
分类专栏： Vue 文章标签： vue vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_39177580/article/details/104177936
版权
在Element-UI中，为el-dropdown-menu组件绑定click事件时，直接使用@click可能无效。解决方法是使用@click.native，确保事件能够正确触发。此问题的解决方案来源于一位博主的分享。
摘要由CSDN通过智能技术生成

记录篇

直接用@click是不生效的 也没有报错
<el-dropdown>
   <span>玲玲</span>
   <el-dropdown-menu slot="dropdown">
       <el-dropdown-item>个人中心</el
最低0.47元/天 解锁文章
不爱吃柚子的柚子姑娘
关注
专栏目录
element-ui二次封装(下拉菜单el-dropdown)
gongliming_qd的博客
01-08 1874
样式效果 效果1 效果2 效果一组件调用 <template> <div> <div v-for="item in tableArr" :key="item"> <Dropdown :propObj="item" @change="menuChange" :selectData="menuSelect.menuSelectData" :buttonIcon="menuSel
vue+elementui dropdown 下拉菜单绑定方法
done1898的博客
02-18 3037
方法一：给el-dropdown根组件监听command ，再el-dropdown-item 绑定commandshuxing值。 methods内详细写监听对应的方法 handleCommand(command) { if(command == 'loginOut'){ this.$confirm('are you sure loginOut?', '提示', { con...
笔记：ElementUI中 el-dropdown 组件在浏览器Zoom缩放后 出现偏移问题
最新发布
sky8880的博客
09-21 172
1.添加属性 :append-to-body="false"
vue element-ui框架 el-dropdown-menu 绑定click事件/.native在组件化开发中的用法
qq_43482288的博客
06-23 578
wolf131721 2018-05-26 10:30:41 25589 收藏 ...
vue element-ui框架 el-dropdown-menu 绑定click事件
热门推荐
wolf
05-26 2万+
使用vue element-ui 中的 导航 发现 el-dropdown-menu 绑定click事件不起作用 &lt;el-dropdown&gt; &lt;i class="el-icon-setting" style="margin-right: 15px"&gt;&lt;/i&gt; &lt;el-dropdown-menu slot="dropd...
el-dropdown-menu 绑定click事件不起作用
jimjiayu
09-18 2446
&lt;el-dropdown&gt; &lt;i class="el-icon-setting" style="margin-right: 15px"&gt;&lt;/i&gt; &lt;el-dropdown-menu slot="dropdown"&gt; &lt;el-dropdown-item&
解决element-ui中下拉菜单子选项click事件不触发的问题
10-18
在使用Vue框架结合Element-UI组件库开发中，我们可能会遇到下拉菜单中子选项的click事件无法触发的问题。Element-UI是一个基于Vue 2.0的桌面端组件库，广泛用于快速开发页面组件。其中，<el-dropdown>组件提供了下拉...
Vue+Element UI 树形控件整合下拉功能菜单（tree + dropdown +input）
10-14
在这个组件中，`<el-tree>`是Element UI提供的树形控件，`data`属性接收树形结构数据，`node-key`用于唯一标识每个节点，`size`控制节点的大小，`highlight-current`高亮当前选中节点，`check-on-click-node`则在...
element-ui大总结
weixin_36852235的博客
02-02 1925
element-ui 使用方法主要有4大块，slot ,属性， method和event。刚开始看这个不久，乍一看感觉有很多东西要记住使用。这个就当是做个主题阅读，知道基本的使用规则，快速索引。真正的熟练还是要在项目中多多练习才行，更重要的是有时间的时候，自己造出这些组建，了解后面的思维原理。 slot &lt;div style="width:800px;"&gt; &lt...
element ui中Dropdown 下拉菜单的选项绑定点击事件
大胖东的博客
04-28 1955
element ui中Dropdown 下拉菜单的选项绑定点击事件 在选项中要使用 @click.native=“xxxxxx”,使用@click无效 <el-dropdown> <div style="color: #fff;font-size: 18px;"> <i class="el-icon-s-custom"></i> <span class="el-dropdown-link"> 欢迎：<s
element-ui 下拉菜单el-dropdown-item添加点击事件
Zing_ing的博客
06-25 1472
native修饰符用于处理DOM原生事件，由于组件 DropDown并没有封装点击事件，因此需要添加原生的点击事件，因此使用@click.native。@click 常见于其用在Vue中的事件绑定，而@实际上是 v-on 的简写，而 v-on 则是对 vue 的事件体系封装之后的 API接口。使用element-ui下拉菜单组件Dropdown时绑定点击事件，事件不生效。
网页[二级菜单]dropdown-menu-icon.rar
05-17
网页首页，通用[二级菜单]模板，下拉菜单项的下拉箭头有翻转的动画特效。完整源代码，仅供参考学习，乐在分享。
el-dropdown-item添加点击事件
weixin_47852232的博客
02-13 705
el-dropdown-item添加点击事件
el-dropdown(下拉菜单)的入门学习
qq_40765784的博客
06-24 2万+
el-dropdown的入门学习
【ElementUI】el-dropdown 下拉菜单
joanmelon的博客
12-06 4644
☀️大家好，我是宾果的救星~希望记录的学习和收获能够帮助大家在开发过程中得到思路并且解决难题。希望大家多多点赞~爱你们哟~
Element UI更改下拉菜单el-dropdown-menu样式
没化妆，别看
02-23 2304
这个样式更改还是有点费劲的，如图：我想更改el-dropdown-item的样式，但是正常覆盖更改无法生效的，从渲染结构可以看出来这个下拉菜单的渲染列表是在文档最底部的。
el-dropdown-menu 添加滚动轴
qq_41562817的博客
12-12 852
背景：使用el-dropdown下拉菜单时，发现el-dropdown-menu 在设置高度和溢出的情况下仍无法添加滚动轴。方法也可在普通盒子上生效。
Dropdown 下拉菜单中点击事件失效 el-dropdown-item 内的 @click点击无效
AmbroseLe
04-06 2116
第一种就是把@click 改为 @click.native 如果不行的话就使用指令@command 写法 <el-dropdown trigger="click" @command="handleCommand" placement="bottom-end" style="margin-left: 10px" > <spa.
el-dropdown组件，菜单自适应
NancyFyn的博客
06-01 1953
菜单自适应
element ui el-men
07-27
引用\[1\]:在Element UI中，如果直接使用@click绑定点击事件，可能会无效。需要使用@click.native来绑定点击事件。例如，在el-dropdown-item上使用@click.native="toEnter"来绑定点击事件。\[1\] 问题: Element UI中的el-menu组件如何绑定点击事件？ 回答: 在Element UI的el-menu组件中，可以使用@click.native来绑定点击事件。例如，可以在el-menu-item上使用@click.native="handleClick"来绑定点击事件。这样当用户点击菜单项时，会触发handleClick方法。 #### 引用[.reference_title] - *1* [element-ui中el-dropdown下拉菜单组件添加点击事件](https://blog.csdn.net/weixin_49078296/article/details/125036207)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值