解决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 相关文章推荐
创建一个复制UBB软件信息的链接或按钮的js代码
Jan 06 Javascript
AJAX异步从优酷专辑中采集所有视频及信息(JavaScript代码)
Nov 20 Javascript
js修改原型的属性使用介绍
Jan 26 Javascript
让alert不出现弹窗的两种方法
May 18 Javascript
node.js中的console.timeEnd方法使用说明
Dec 09 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
jquery实现全选功能效果的实现代码
May 05 Javascript
JS获取浮动(float)元素的style.left值为空的快速解决办法
Feb 19 Javascript
EasyUI在Panel上动态添加LinkButton按钮
Aug 11 Javascript
基于angular6.0实现的一个组件懒加载功能示例
Apr 12 Javascript
深入理解Angularjs 脏值检测
Oct 12 Javascript
vue.js实现照片放大功能
Jun 23 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
php 面试碰到过的问题 在此做下记录
2011/06/09 PHP
smarty 缓存控制前的页面静态化原理
2013/03/15 PHP
php通过字符串调用函数示例
2014/03/02 PHP
yii框架无限极分类的实现方法
2017/04/08 PHP
深入解析Laravel5.5中的包自动发现Package Auto Discovery
2017/09/13 PHP
PHP实现页面静态化深入讲解
2021/03/04 PHP
jQuery学习笔记之控制页面实现代码
2012/02/27 Javascript
JavaScript中的数组操作介绍
2014/12/30 Javascript
javascript消除window.close()的提示窗口
2015/05/20 Javascript
JavaScript设置、获取、清除单值和多值cookie的方法
2015/11/17 Javascript
分享有关jQuery中animate、slide、fade等动画的连续触发、滞后反复执行的bug
2016/01/10 Javascript
JS动态的把左边列表添加到右边的实现代码(可上下移动)
2016/11/17 Javascript
Vue表单及表单绑定方法
2018/09/04 Javascript
详解element-ui中form验证杂记
2019/03/04 Javascript
改变layer confirm弹窗按钮的颜色方法
2019/09/12 Javascript
vue+canvas实现拼图小游戏
2020/09/18 Javascript
Python实现获取本地及远程图片大小的方法示例
2018/07/21 Python
Python3实现对列表按元组指定列进行排序的方法分析
2018/12/22 Python
windows系统中Python多版本与jupyter notebook使用虚拟环境的过程
2019/05/15 Python
python对象转字典的两种实现方式示例
2019/11/07 Python
Python如何把十进制数转换成ip地址
2020/05/25 Python
python dir函数快速掌握用法技巧
2020/12/09 Python
CSS3盒子模型详解
2013/04/24 HTML / CSS
HTML5实现获取地理位置信息并定位功能
2015/04/25 HTML / CSS
HTML里显示pdf、word、xls、ppt的方法示例
2020/04/14 HTML / CSS
德国大型的家具商店:Pharao24.de
2016/10/02 全球购物
Banggood官网:面向全球客户的综合商城
2017/04/19 全球购物
波兰电子产品购物网站:Vobis
2019/05/26 全球购物
旅游网创业计划书
2014/01/31 职场文书
办公室副主任职责范本
2014/03/08 职场文书
求职自我评价范文100字
2014/09/23 职场文书
入党介绍人意见范文
2015/06/01 职场文书
学生检讨书范文
2019/06/24 职场文书
详解Python牛顿插值法
2021/05/11 Python
Python查找算法的实现 (线性、二分,分块、插值查找算法)
2022/04/24 Python
SqlServer常用函数及时间处理小结
2023/05/08 SQL Server