回车触发了Button的click事件(点击回车,结果调用了按钮的点击事件----解决办法)

方法1.

按钮点击后,执行失去焦点函数

复制代码
<el-button type="primary" @click="(e)=>clearPlatSearch(e)">清空搜索</el-button>
// 让button失去焦点
    clearPlatSearch(e){
      if(e){
        let target = e.target
        // 根据button组件内容 里面包括一个span标签,如果设置icon,则还包括一个i标签,其他情况请自行观察。
        // 所以,在我们点击到button组件上的文字也就是span标签上时,直接执行e.target.blur()不会生效,所以要加一层判断。
        if (target.nodeName === 'SPAN' || target.nodeName === 'I') {
          target = e.target.parentNode
        }
        // 让其失去焦点
        target.blur()
      }
    },

方法二:

@keyup.prevent.native @keydown.enter.prevent.native

复制代码
<el-button type="primary"  @keyup.prevent.native @keydown.enter.prevent.native @click="clear">清空搜索</el-button>
相关推荐
程序员黑豆6 分钟前
AI全栈开发 - Java:数据类型
java·前端
江华森10 分钟前
Tomcat 10 实战部署指南:从零到生产级 Web 容器
java·前端·tomcat
放下华子我只抽RuiKe516 分钟前
FastAPI 全栈后端(五):后台任务与消息队列
前端·javascript·react.js·ai·前端框架·fastapi·ai编程
丷丩16 分钟前
MapLibre GL JS第44课:生成并添加缺失图标
前端·javascript·gis·mapblibre gl js
snow@li22 分钟前
前端:下拉框里边的数据叫啥 / 怎么称呼
前端
禁默37 分钟前
数字人切入,我用魔珐星云搭建政务大厅咨询数字人,低成本落地便民接待
前端·人工智能·政务
小二·41 分钟前
React 18 新特性与 Hooks 进阶实战
前端·react.js·前端框架
Shadow(⊙o⊙)44 分钟前
QT常用控件3.0,font字体设置,toolTip提示,focusPolicy焦点定位原则,中型控件StyleSheet样式表。
服务器·开发语言·前端·c++·qt
六月的可乐1 小时前
【干货】小程序虚拟瀑布流探索小结
前端·react.js·小程序
techdashen1 小时前
Rust 项目管理动态 — 2026 年 3 月
前端·人工智能·rust