解决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 相关文章推荐
JS option location 页面跳转实现代码
Dec 27 Javascript
Javascript remove 自定义数组删除方法
Oct 20 Javascript
js 蒙版进度条(结合图片)
Mar 10 Javascript
JQuery从头学起第三讲
Jul 06 Javascript
js局部刷新页面时间具体实现
Jul 04 Javascript
分享Javascript中最常用的55个经典小技巧
Nov 29 Javascript
javascript浏览器兼容教程之事件处理
Jun 09 Javascript
jQuery实现只允许输入数字和小数点的方法
Mar 02 Javascript
微信开发之调起摄像头、本地展示图片、上传下载图片实例
Dec 08 Javascript
JS实现加载时锁定HTML页面元素的方法
Jun 24 Javascript
javascriptvoid(0)含义以及与&quot;#&quot;的区别讲解
Jan 19 Javascript
微信小程序全局变量功能与用法详解
Jan 22 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
How do I change MySQL timezone?
2008/03/26 PHP
Zend framework处理一个http请求的流程分析
2010/02/08 PHP
PHP调用Linux的命令行执行文件压缩命令
2013/01/27 PHP
ThinkPHP函数详解之M方法和R方法
2015/09/10 PHP
PHP设计模式之建造者模式(Builder)原理与用法案例详解
2019/12/12 PHP
javascript判断chrome浏览器的方法
2014/03/26 Javascript
JavaScript中的方法重载实例
2015/03/16 Javascript
JS基于Ajax实现的网页Loading效果代码
2015/10/27 Javascript
BootStrap中Datetimepicker和uploadify插件应用实例小结
2016/05/26 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
2016/08/31 Javascript
JS基于递归实现倒计时效果的方法
2016/11/26 Javascript
详解angular中通过$location获取路径(参数)的写法
2017/03/21 Javascript
jQuery extend()详解及简单实例
2017/05/06 jQuery
angular.js指令中transclude选项及ng-transclude指令详解
2017/05/24 Javascript
微信小程序有旋转动画效果的音乐组件实例代码
2018/08/22 Javascript
JS实现换肤功能的方法实例详解
2019/01/30 Javascript
微信小程序如何获取群聊的openGid以及名称详解
2019/07/17 Javascript
windows下cx_Freeze生成Python可执行程序的详细步骤
2018/10/09 Python
Python中psutil的介绍与用法
2019/05/02 Python
python批量修改ssh密码的实现
2019/08/08 Python
Python中join()函数多种操作代码实例
2020/01/13 Python
使用Python开发个京东上抢口罩的小实例(仅作技术研究学习使用)
2020/03/10 Python
HTML5 Web Workers之网站也能多线程的实现
2013/04/24 HTML / CSS
html5版canvas自由拼图实例
2014/10/15 HTML / CSS
HTML 5.1来了 9月份正式发布 更新内容预览
2016/04/26 HTML / CSS
浅谈Html5中视频 音频标签 进度条的问题
2016/07/26 HTML / CSS
FLOS美国官网:意大利高级照明工艺的传奇
2018/08/07 全球购物
蔻驰法国官网:COACH法国
2018/11/14 全球购物
西班牙在线药店:DosFarma
2020/03/28 全球购物
当我正在为表建立索引的时候,SQL Server 会禁止对表的访问吗
2014/04/28 面试题
Ruby中的保护方法和私有方法与一般面向对象程序设计语言的一样吗
2013/05/01 面试题
单位实习介绍信
2015/05/05 职场文书
2016十一国庆节慰问信
2015/12/01 职场文书
Windows10下安装MySQL8
2021/04/06 MySQL
Go timer如何调度
2021/06/09 Golang
Redis 常见使用场景
2021/08/30 Redis