vue elementui el-dropdown-item设置@click无效的解决方案

如图,直接在el-dropdown-item上面设置@click,相应的method并没有被触发,查找资料发现需要在它的上级 el-dropdown 处使用 @command 方法触发。

【template】

javascript 复制代码
<el-dropdown placement="bottom-end" @command="handleCommand">
  <el-button type="text"><i class="el-icon-more"></i></el-button>
  <el-dropdown-menu slot="dropdown">
    <el-dropdown-item command="option1">Option1</el-dropdown-item>
    <el-dropdown-item command="option2">Option2</el-dropdown-item>
  </el-dropdown-menu>
</el-dropdown>

【methods】

javascript 复制代码
handleCommand(command){
  if(command === 'option1') {
    this.visible1 = true
  }      
  if(command === 'option2') {
    this.visible2 = true
  }      
},

【参考文章】

使用element-UI的el-dropdown时绑定@click,click事件不触发。_el dropdown click-CSDN博客

相关推荐
卢叁2 分钟前
Flutter之自定义TabIndicator
前端·flutter
每天吃饭的羊14 分钟前
state和ref
前端·javascript·react.js
GEO_YScsn16 分钟前
Vite:Next-Gen Frontend Tooling 的高效之道——从原理到实践的性能革命
前端·javascript·css·tensorflow
GISer_Jing16 分钟前
滴滴二面(准备二)
前端·javascript·vue·reactjs
ningmengjing_19 分钟前
webpack打包方式
前端·爬虫·webpack·node.js·逆向
Yuner200021 分钟前
Webpack开发:从入门到精通
前端·webpack·node.js
GISer_Jing23 分钟前
滴滴二面准备(一)
前端·javascript·面试·ecmascript
lecepin39 分钟前
AI Coding 资讯 2025-09-10
前端·javascript·面试
RestCloud1 小时前
PostgreSQL大表同步优化:如何避免网络和内存瓶颈?
前端·数据库·api
RestCloud1 小时前
iPaaS 与传统 ESB 的区别,企业该如何选择?
前端·架构