回车触发了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>
相关推荐
colicode18 小时前
安卓Android语音验证码接口API示例代码:Kotlin/Java版App验证开发
android·java·前端·前端框架·kotlin·语音识别
万物得其道者成1 天前
前端大整数精度丢失:一次踩坑后的实战解决方案(`json-bigint`)
前端·json
鹏北海1 天前
移动端 H5 响应式字体适配方案完全指南
前端
柳杉1 天前
使用AI从零打造炫酷医疗数据可视化大屏,源码免费拿!
前端·javascript·数据可视化
凌云拓界1 天前
前端开发的“平衡木”:在取舍之间找到最优解
前端·性能优化·架构·前端框架·代码规范·设计规范
zhengfei6111 天前
【XSS payload 】一个经典的XSS payload
前端·xss
全栈老石1 天前
手写一个无限画布 #1:坐标系的谎言
前端·canvas
XW01059991 天前
4-11判断素数
前端·python·算法·素数
J2虾虾1 天前
Spring Boot中使用@Scheduled做定时任务
java·前端·spring boot
Heo1 天前
深入React19任务调度器Scheduler
前端·javascript·面试