场景

添加属性对话框中，input输入后点击 enter，不会执行绑定的 handleDialogQuery 事件，反而会刷新整个页面；

如果不点击 enter，点击搜索按钮，则是正常的。

又测试：在 属性组页面中，input 输入后点击 enter，是正常的，不会刷新整个页面。

解决办法：给 form 添加 @submit.native.prevent

原因

在一个 form 表单中，若只有一个 input，按回车键表单会自动提交，但是当表单中存在多个 input 时，按回车键不会执行任何操作，这是 form 表单的一个特性。

参考链接

表单中设置了 `keyup.enter.native` 的按键事件，但是回车后没有执行查询，反而会刷新页面的更多相关文章

  1. keyup.enter.native&click.native.prevent

    vue 监听键盘回车事件 @keyup.enter || @keyup.enter.native vue运行为v-on在监听键盘事件时,添加了特殊的键盘修饰符: <input v-on:keyu ...

  2. vue 监听键盘回车事件 @keyup.enter || @keyup.enter.native

    vue运行为v-on在监听键盘事件时,添加了特殊的键盘修饰符:\ <input v-on:keyup.13="submit"> vue还非常贴心地给出了常用按键的别名, ...

  3. 在一个form表单中根据不同按钮实现多个action事件

    <form id="writeForm" method="post"> <div class="write-btn-tj" ...

  4. 判断密码是否可见/判断登录的状态/判断在form表单中 定义rules规则验证(iview)

    一: 判断密码是否可见判断:type="visiblePassword ? 'text' : 'password'" 是否为false 或者 true 密码为输入框或者文本框点击眼 ...

  5. 使用 elementUI 的表单进行查询，表单中只有一个文本框时，回车会自动触发表单的提交事件，导致页面的刷新。

    使用elementUI的el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面: 原因:由于当表单只有一个文本框时,按下回车将会触发表单的提交事件, 从而导致页面刷新. ...

  6. 当使用vue的按键修饰符不起效果的时候怎么办?如@keyup.enter = '' ;

    这个问题困扰了我一个多小时,各种测bug !始终测不出来! 直接上代码(错误示范) <el-form-item prop="password"> <el-inpu ...

  7. element-ui 的input组件 @keyup.enter事件的添加办法

    <el-input placeholder="请输入密码" type="password" @keyup.enter.native="login ...

  8. ElementUI el-input标签 绑定keyup事件v-on:keyup.enter="convert"无效解决方案

    期望实现,输入数字后,回车直接执行点击按钮"转换" 无效写法: <el-input v-model="input" placeholder="请 ...

  9. Vue element keyup.enter失效不起作用

    解决方式一 添加按键修饰符@keyup.enter.native 解决方式二 把事件绑定到父元素(外框),需注意多个input问题 <div @keyup.enter="login&q ...

随机推荐

  1. TCP 协议有哪些缺陷？

    作者:小林coding 图解计算机基础网站:https://xiaolincoding.com 大家好,我是小林. 忽然思考一个问题,TCP 通过序列号.确认应答.超时重传.流量控制.拥塞控制等方式实 ...

  2. 什么叫做 SSO

    什么叫做 SSO 本文写于 2020 年 12 月 8 日 SSO 的全称叫做 Single Sign On,意味「单点登录」. 何为单点登录?就是你希望自己的两个网站,可以做到:一个网站登录了,另一 ...

  3. 8┃音视频直播系统之 WebRTC 信令系统实现以及通讯核心并实现视频通话

    一.信令系统 信令系统主要用来进行信令的交换 在通信双方彼此连接.传输媒体数据之前,它们要通过信令服务器交换一些信息,如规范协商 若 A 与 B 要进行音视频通信,那么 A 要知道 B 已经上线了,同 ...

  4. iOS全埋点解决方案-数据存储

    前言 ​ SDK 需要把事件数据缓冲到本地,待符合一定策略再去同步数据. 一.数据存储策略 ​ 在 iOS 应用程序中,从 "数据缓冲在哪里" 这个纬度看,缓冲一般分两种类型. 内 ...

  5. 使用 Vite 插件开发构建 Tampermonkey 用户脚本

    起因 一直以来,我都是直接在浏览器 Tampermonkey 扩展页面直接新建用户脚本来开发的: 对于一些简单的脚本,这没有什么问题,即改即看.但当代码多了以后问题就来了,自带编辑器开发体验确实不太舒 ...

  6. DCM：一个能够改善所有应用数据交互场景的中间件新秀

    摘要:几乎所有涉及应用数据交互的场景都可以通过DCM来改善应用结构,提升开发与计算效率. 本文分享自华为云社区<DCM:中间件家族迎来新成员>,作者: 石臻臻的杂货铺. DCM是什么 现代 ...

  7. 【Java面试】什么是幂等？如何解决幂等性问题？

    一个在传统行业工作了7年的粉丝私信我. 他最近去很多互联网公司面试,遇到的很多技术和概念都没听过. 其中就有一道题是:"什么是幂等.如何解决幂等性问题"? 他说,这个概念听都没听过 ...

  8. unittest自动化测试框架核心要素以及应用

    1. unittest核心要素 unittest介绍 测试框架,不仅仅用于单元测试 python自动的测试包 用法和django.test.TestCase类似 1.1.unitest介绍和核心要素 ...

  9. Java使用FreeMarker模版技术动态生成word实践

    一.序言 在日常开发中,常常有动态word文件生成的需求,通过编制模版,然后动态修改word内容以组合成新的文件.报告单.请假单.发票页等都可以使用动态生成word来解决. 笔者总结归纳出通用技术要点 ...

  10. 线程崩溃为什么不会导致 JVM 崩溃

    大家好,我是坤哥 网上看到一个很有意思的据说是美团的面试题:为什么线程崩溃崩溃不会导致 JVM 崩溃,这个问题我看了不少回答,但都没答到根本原因,所以决定答一答,相信大家看完肯定会有收获,本文分以下几 ...