解决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 2.0实用简明教程之应用ExtJS
Apr 29 Javascript
javascript学习笔记(八) js内置对象
Jun 19 Javascript
js去字符串前后空格5种实现方法及比较
Apr 03 Javascript
在JavaScript的正则表达式中使用exec()方法
Jun 16 Javascript
Node做中转服务器转发接口
Oct 18 Javascript
es6在react中的应用代码解析
Nov 08 Javascript
JS中call和apply函数用法实例分析
Jun 20 Javascript
微信小程序开发问题之wx.previewImage
Dec 25 Javascript
vue input实现点击按钮文字增删功能示例
Jan 29 Javascript
解决layer.msg 不居中 ifram中的问题
Sep 05 Javascript
layui实现根据table数据判断按钮显示情况的方法
Sep 26 Javascript
node.js如何操作MySQL数据库
Oct 29 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
地球防卫队:陪着奥特曼打小怪兽的人类力量 那些经典队服
2020/03/08 日漫
PHP5 安装方法
2006/10/09 PHP
建站常用13种PHP开源CMS比较
2009/08/23 PHP
php通用防注入程序 推荐
2011/02/26 PHP
CodeIgniter针对lighttpd服务器URL重写的方法
2015/06/10 PHP
PHP针对字符串开头和结尾的判断方法
2016/07/11 PHP
[原创]PHP正则匹配中英文、数字及下划线的方法【用户名验证】
2017/08/01 PHP
php成功操作redis cluster集群的实例教程
2019/01/13 PHP
不要小看注释掉的JS 引起的安全问题
2008/12/27 Javascript
jquery 操作iframe的几种方法总结
2013/12/13 Javascript
jquery插件推荐浏览器嗅探userAgent
2014/11/09 Javascript
HTML,CSS,JavaScript速查表推荐
2014/12/02 Javascript
Javascript控制div属性动态变化实例分析
2015/10/08 Javascript
最佳的JavaScript错误处理实践
2016/07/16 Javascript
禁用backspace网页回退功能的实现代码
2016/11/15 Javascript
JavaScript易错知识点整理
2016/12/05 Javascript
微信小程序开发(一) 微信登录流程详解
2017/01/11 Javascript
JS实现队列的先进先出功能示例
2017/05/10 Javascript
微信小程序swiper左右扩展各显示一半代码实例
2019/12/05 Javascript
在Python中操作字典之clear()方法的使用
2015/05/21 Python
Python3.5面向对象程序设计之类的继承和多态详解
2019/04/24 Python
python2和python3在处理字符串上的区别详解
2019/05/29 Python
python自动化测试之DDT数据驱动的实现代码
2019/07/23 Python
CSS3利用text-shadow属性实现多种效果的文字样式展现方法
2016/08/25 HTML / CSS
基于HTML5 Canvas 实现弹出框效果
2017/06/05 HTML / CSS
详解通过变换矩阵实现canvas的缩放功能
2019/01/14 HTML / CSS
HTML5 video进入全屏和退出全屏的实现方法
2020/07/28 HTML / CSS
京东国际站:JOYBUY
2017/11/23 全球购物
欧洲最大的滑雪假期供应商之一:Sunweb Holidays
2018/01/06 全球购物
为什么使用接口?
2014/08/13 面试题
酒店管理专业毕业生推荐信
2013/11/10 职场文书
关于保护环境的标语
2014/06/09 职场文书
小学阳光体育活动总结
2014/07/05 职场文书
责任书范本
2014/08/25 职场文书
mysql多表查询-笔记七
2021/04/05 MySQL
带你了解Java中的ForkJoin
2022/04/28 Java/Android