el-dropdown-item添加@click不生效

最新推荐文章于 2023-02-13 15:30:24 发布
最新推荐文章于 2023-02-13 15:30:24 发布
阅读量371 收藏
点赞数 2
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/edtwar/article/details/117149748
版权

0 环境

  • 操作系统：win10

1 正确代码

<el-dropdown-item @click.native="logout">退出</el-dropdown-item>

2 答案

参考文章

看了下拉菜单的文档 确实没有click事件说明(不想用文档上的方法) 但使用click又不生效 最后在segmentfault找到了答案 将@click改为@click.native即可 当你给一个vue组件绑定事件时候，要加上native！如果是普通的html元素！就不需要或者是native就是把组件变回原生DOM的一种方式 还是没有把握 什么时候用什么 就先用@click 没生效 再用@click.native

刺骨寒风刺
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue+element搭建后台小总结 el-dropdown下拉功能
10-16
主要为大家详细介绍了vue+element搭建后台小总结，el-dropdown下拉功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
paper-dropdown-menu:材质设计浏览器选择元素
03-06
paper-dropdown-menu与本地浏览器的select元素相似。 paper-dropdown-menu包含可选内容。 请参阅：， 。 用法 安装 npm install --save @polymer/paper-dropdown-menu 在一个html文件中 < html > < head...
vant 自定义 van-dropdown-item的用法
10-15
主要介绍了vant 自定义 van-dropdown-item的用法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
el-dropdown-item @click事件无效
csdn_zhuang的博客
12-09 581
<el-dropdown-menu slot="dropdown"> <el-dropdown-item @click.native="viewAccountHandle()">账户信息</el-dropdown-item> <el-dropdown-item @click.native="modifyPwd...
el-dropdown-item的click事件无效
qq_36566924的博客
06-07 143
在click后面加上 @click.native=""
el-dropdown绑定click点击事件不生效和样式修改
x_XDGS的博客
04-08 2557
el-dropdown绑定click点击事件不生效和样式修改 我们在开发项目的时候会用到el-dropdown，这个功能一般都会在用户上进行使用 比如： 修改密码，退出的情况下 绑定点击事件 组件直接绑定点击事件是不生效的，需要通过 @click.native=‘logout’ 这种方式来进行绑定点击事件。 修改样式 先看图： 这个组件的DOM不在#app里面，和#app是同级关系。 如果我们要修改组件样式的话，我们就不能再style上加scoped，必须全局修改，这样就会出现一个情况：我们在其他地方使
element UI中下拉菜单的el-dropdown-item无法触发click事件怎么解决？
m0_47147246的博客
04-06 3221
element UI中下拉菜单的el-dropdown-item无法触发click事件怎么解决？ <el-dropdown class="infor" size="medium"> <span> <i class="el-icon-more-outline"></i> </span> <el-dropdown-menu slot="dropdown"> <el-dropdown-item&gt
el-dropdown-item添加点击事件
weixin_47852232的博客
02-13 580
el-dropdown-item添加点击事件
Dropdown 下拉菜单中点击事件失效 el-dropdown-item 内的 @click点击无效
AmbroseLe
04-06 1928
第一种就是把@click 改为 @click.native 如果不行的话就使用指令@command 写法 <el-dropdown trigger="click" @command="handleCommand" placement="bottom-end" style="margin-left: 10px" > <spa.
解决vue使用vant下拉框van-dropdown-item 绑定title值不变问题
10-15
主要介绍了解决vue使用vant下拉框van-dropdown-item 绑定title值不变问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
在element ui中如何自定义el-date-picker的宽度 笔记
热门推荐
日光之下的博客
07-09 2万+
0 环境 系统：win10 IDE: IDEA 数据库：sqlserver 1 正文 网上试了好几种方法 没生效 前端水平太菜了 没办法最后添加个style 在里面定义宽度 <el-date-picker>style="width:250px"</el-date-picker>
element el-form-item el-input宽度设置
日光之下的博客
06-01 7084
0 环境 系统环境：win10 1 发现问题 为el-input设置label-width="100px"不生效 2 解决问题 1 为当前页面所有el-input设置相同宽度 .el-input { width: 自定义宽带; }
vue+element表格中使用render函数(if判断处理)
日光之下的博客
05-29 2371
0 环境 系统环境：win10 1 问题描述 使用别人集成好的table插件 复杂表格使用render操作 搜了一下render+if判断基本上是介绍createElement怎么用(也可能是我搜索姿势不对) 没爱了 我就想加2个判断 把值塞到标签里 2 解决 官网上写 在 Vue 中使用 JSX 语法，它可以让我们回到更接近于模板的语法上 react也有JSX语法 我直接试试用react写法写vue render函数 1 对应列 column column: [
vue echarts饼图封装以及同一个组件2个饼图不加载问题解决
日光之下的博客
12-16 2340
0 环境 系统：win10 前端框架：vue 前端IDE：vscode 1 饼图封装 1 安装echarts npm install echarts --save 2 查看是否安装成功 文件查看 界面查看(win+r --> 输入cmd --> 输入vue ui 等待启动) 3 在main.js中引入echarts import echarts from "echarts"; Vue.prototype.$echarts = echarts; 2 封装组件 1 新建子组
django+vue axios简单封装
日光之下的博客
12-03 762
0 环境 系统环境：win10 前端编辑器：vscode 依赖：axios 1 axios安装 1 方式1(命令操作) // 安装axios(创建的vue项目的根目录) npm install axios; 2 方式2(可视化界面操作) 快捷方式(win+r) --> cmd --> 输入vue ui --> 自动会跳转8000端口(默认) 2 封装axios 可以配合全局拦截(请求拦截+响应拦截) 自行搜索 1 新建http.js 2 curd封装 import
vue一键复制实现 笔记
日光之下的博客
09-16 373
0 环境 系统环境：window 编辑器：IDEA,vscode 1 准备 vue-clipboard2参考资料 2 安装 安装vue-clipboard2 npm install --save vue-clipboard2 在main.js中引入它 import VueClipboard from 'vue-clipboard2' Vue.use(VueClipboard) 3 实现 效果 参考代码 <p>{{message}}</p> <button
<div> <el-button @click="showClick">show</el-button> </div> <el-dropdown ref="dropdown1" trigger="contextmenu" style="margin-right: 30px"> <template #dropdown> <el-dropdown-menu> <el-dropdown-item>Action 1</el-dropdown-item> <el-dropdown-item>Action 2</el-dropdown-item> <el-dropdown-item>Action 3</el-dropdown-item> <el-dropdown-item disabled>Action 4</el-dropdown-item> <el-dropdown-item divided>Action 5</el-dropdown-item> </el-dropdown-menu> </template> </el-dropdown> 这段代码应该如何添加show方法
最新发布
05-25
<el-button @click="showClick">show</el-button> <el-dropdown ref="dropdown1" trigger="contextmenu" style="margin-right: 30px"> <template #dropdown> <el-dropdown-menu> <el-dropdown-item>Action 1</...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值