场景

添加属性对话框中,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. 一个程序的自我修养「GitHub 热点速览 v.22.19」

    一个程序要诞生涉及前后端技术,比如,你可以用可视化网页搭建工具 tmagic-editor 完成前端部分,而后端部分的数据库以及数据处理可能就要用到 jsonhero-web 和 directus.知 ...

  2. kernel heap bypass smep,smap && 劫持modprobe_path

    kernel heap bypass smep,smap && 劫持modprobe_path exp1 smep:smep即用户数据不可执行,当 CPU 处于 ring0 模式时,执 ...

  3. k8s client-go源码分析 informer源码分析(3)-Reflector源码分析

    k8s client-go源码分析 informer源码分析(3)-Reflector源码分析 1.Reflector概述 Reflector从kube-apiserver中list&watc ...

  4. 【mq】从零开始实现 mq-11-消费者消息回执添加分组信息 pull message ack groupName

    前景回顾 [mq]从零开始实现 mq-01-生产者.消费者启动 [mq]从零开始实现 mq-02-如何实现生产者调用消费者? [mq]从零开始实现 mq-03-引入 broker 中间人 [mq]从零 ...

  5. 循环中的scanf处理了换行符怎么破

    这种情况一般在循环中要求输入一个字符时容易出现问题. 问题在于缓冲区,缓冲区中存留了换行符,所以... 运行下面代码: int main(void){ char a=0; while(1){ scan ...

  6. 从MySQL全备文件中恢复单个库或者单个表

    从MySQL全备文件中恢复单个库或者单个表 提取建库语句 sed -n '/^-- Current Database: db_cms/,/^-- Current Database: `/p' back ...

  7. 234. Palindrome Linked List - LeetCode

    Question 234. Palindrome Linked List Solution 题目大意:给一个链表,判断是该链表中的元素组成的串是否回文 思路:遍历链表添加到一个list中,再遍历lis ...

  8. 145_Power BI Report Server自定义Form登录

    博客:www.jiaopengzi.com 焦棚子的文章目录 请点击下载附件 1.背景 很久没有更新Power BI Report Server了,发现自己机器还是2021年1月版本的,现在更新了20 ...

  9. 关于『进击的Markdown』:第五弹

    关于『进击的Markdown』:第五弹 建议缩放90%食用 路漫漫其修远兮,吾将上下而求索.  我们要接受Mermaid的考验了呢  Markdown 语法真香(一如既往地安利) ( 进击吧!Mark ...

  10. QT 基于QScrollArea的界面嵌套移动

    在实际的应用场景中,经常会出现软件界面战场图大于实际窗体大小,利用QScrollArea可以为widget窗体添加滚动条,可以实现小窗体利用滚动条显示大界面需求.实现如下: QT创建一个qWidget ...