解决element-ui中下拉菜单子选项click事件不触发的问题


Posted in Javascript onAugust 22, 2018

将@click改为@click.native='logoutHandle';即可监听选项的点击事件。

<el-dropdown class="pull-right" >
   <span class="el-dropdown-link">
    <img src="./img/header.jpg" alt="" class="pull-right">
   </span>
   <el-dropdown-menu slot="dropdown">
    <el-dropdown-item @click.native="logoutHandle">退出</el-dropdown-item>
   </el-dropdown-menu>
   </el-dropdown>

vue使用element-ui,发现用@click事件不生效?怎么解决?

如下所示:

今天用到element-ui里的一个组件,下拉菜单

解决element-ui中下拉菜单子选项click事件不触发的问题

发现在组件里写入@click事件

解决element-ui中下拉菜单子选项click事件不触发的问题

在页面打开以后发现,转译了之后并没有click事件

解决element-ui中下拉菜单子选项click事件不触发的问题

最后发现用@click.native

解决element-ui中下拉菜单子选项click事件不触发的问题

就OK了!

以上这篇解决element-ui中下拉菜单子选项click事件不触发的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Extjs优化(二)Form表单提交通用实现
Apr 15 Javascript
php中给js数组赋值方法
Mar 10 Javascript
Jquery ui datepicker设置日期范围,如只能隔3天【实现代码】
May 04 Javascript
jQuery+php实时获取及响应文本框输入内容的方法
May 24 Javascript
javascript 实现动态侧边栏实例详解
Nov 11 Javascript
BootStrap 下拉菜单点击之后不会出现下拉菜单(下拉菜单不弹出)的解决方案
Dec 14 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(一)
Jan 21 Javascript
JS查找英文文章中出现频率最高的单词
Mar 20 Javascript
vue.js实现只弹一次弹框
Jan 29 Javascript
js操作二进制数据方法
Mar 03 Javascript
vue 中filter的多种用法
Apr 26 Javascript
解决vscode进行vue格式化,会自动补分号和双引号的问题
Oct 26 Javascript
微信小程序 Animation实现图片旋转动画示例
Aug 22 #Javascript
Vue动态获取width的方法
Aug 22 #Javascript
微信小程序调用摄像头隐藏式拍照功能
Aug 22 #Javascript
Vue2.2.0+新特性整理及注意事项
Aug 22 #Javascript
Vue之mixin全局的用法详解
Aug 22 #Javascript
React中使用UEditor百度富文本的方法
Aug 22 #Javascript
VUE 全局变量的几种实现方式
Aug 22 #Javascript
You might like
ecshop 订单确认中显示省市地址信息的方法
2010/03/15 PHP
php获取指定日期之间的各个周和月的起止时间
2014/11/24 PHP
常见php数据文件缓存类汇总
2014/12/05 PHP
PHP使用适合阅读的格式显示文件大小的方法
2015/03/05 PHP
php编写简单的文章发布程序
2015/06/18 PHP
PHP文件缓存smarty模板应用实例分析
2016/02/26 PHP
对php 判断http还是https,以及获得当前url的方法详解
2019/01/15 PHP
IE6下JS动态设置图片src地址问题
2010/01/08 Javascript
简单实用的js调试logger组件实现代码
2010/11/20 Javascript
可插入图片的TEXT文本框
2013/12/27 Javascript
jquery数组过滤筛选方法grep()简介
2014/06/06 Javascript
JavaScript多并发问题如何处理
2015/10/28 Javascript
简单实现js拖拽效果
2017/07/25 Javascript
vue2.0 实现页面导航提示引导的方法
2018/03/13 Javascript
使用bootstrap实现下拉框搜索功能的实例讲解
2018/08/10 Javascript
详解Vue一个案例引发「内容分发slot」的最全总结
2018/12/02 Javascript
8个有意思的JavaScript面试题
2019/07/30 Javascript
小程序和web画三角形实现解析
2019/09/02 Javascript
ant design中upload组件上传大文件,显示进度条进度的实例
2020/10/29 Javascript
[39:18]完美世界DOTA2联赛PWL S3 Forest vs LBZS 第二场 12.17
2020/12/19 DOTA
python  文件的基本操作 菜中菜功能的实例代码
2019/07/17 Python
通过Python编写一个简单登录功能过程解析
2019/09/04 Python
python KNN算法实现鸢尾花数据集分类
2019/10/24 Python
python中栈的原理及实现方法示例
2019/11/27 Python
Python 模拟生成动态产生验证码图片的方法
2020/02/01 Python
JetBrains PyCharm(Community版本)的下载、安装和初步使用图文教程详解
2020/03/19 Python
Python Tornado之跨域请求与Options请求方式
2020/03/28 Python
Python利用PyPDF2库获取PDF文件总页码实例
2020/04/03 Python
Python json转字典字符方法实例解析
2020/04/13 Python
SneakerStudio英国:最佳运动鞋商店
2019/05/22 全球购物
保护环境倡议书100字
2014/05/19 职场文书
思想作风建设心得体会
2014/10/22 职场文书
单位工作证明范本
2015/06/15 职场文书
spring boot中nativeQuery的用法
2021/07/26 Java/Android
vue ref如何获取子组件属性值
2022/03/31 Vue.js
vue @ ~ 相对路径 路径别名设置方式
2022/06/05 Vue.js