当前位置: 首页 > news >正文

element中input框添加@keyup.enter.native,按enter后刷新页面

按enter键本来是调用搜索接口,但却是刷新了整个页面

<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="110px"><el-form-item label="场景名称:" prop="actionName"><el-inputv-model="queryParams.actionName"placeholder="请输入名称"clearablesize="small"@keyup.enter.native="handleQuery"/></el-form-item><el-form-item><el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button><el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button></el-form-item></el-form>

原因:form 表单中只有一个输入框,在输入框中按下回车就是提交该表单,且会刷新页面。阻止这一默认行为,可以 在 form 标签上添加 @submit.native.prevent就可以解决刷新整个页面的问题。

<el-form :model="queryParams"  label-width="110px" @submit.native.prevent>

相关文章:

  • allure测试报告用例数和 pytest执行用例数不相同问题
  • 力扣53. 最大子数组和
  • Ubuntu 22.04 .NET8 程序 环境安装和运行
  • AI的制作思维导图
  • 基于Python的农业统计数据可视化系统设计与实现
  • HTML、HTML5一览
  • [线程与网络] 网络编程与通信原理(四):深入理解传输层UDP与TCP协议
  • AR和AP重分类(Regroup)[FAGLF101/OBBU/OBBV]
  • LocalViT 论文解读
  • 前端传String字符串 后端使用enun枚举类出现错误
  • 嵌入式移植jpeglib--Linux交叉编译ARM平台
  • 创建线程的技术难点
  • VOC格式标签各个字段的解释
  • 对 SQL 说“不”~
  • 随便用css换个渐变的太阳
  • IE报vuex requires a Promise polyfill in this browser问题解决
  • java 多线程基础, 我觉得还是有必要看看的
  • java8-模拟hadoop
  • Javascript基础之Array数组API
  • Java基本数据类型之Number
  • Js基础——数据类型之Null和Undefined
  • PAT A1017 优先队列
  • Web Storage相关
  • 给自己的博客网站加上酷炫的初音未来音乐游戏?
  • 微信小程序--------语音识别(前端自己也能玩)
  • 在 Chrome DevTools 中调试 JavaScript 入门
  • 7行Python代码的人脸识别
  • # Kafka_深入探秘者(2):kafka 生产者
  • # 计算机视觉入门
  • #我与Java虚拟机的故事#连载15:完整阅读的第一本技术书籍
  • %@ page import=%的用法
  • (SpringBoot)第七章:SpringBoot日志文件
  • (八)Flask之app.route装饰器函数的参数
  • (备份) esp32 GPIO
  • (翻译)terry crowley: 写给程序员
  • (附源码)spring boot校园健康监测管理系统 毕业设计 151047
  • (附源码)计算机毕业设计SSM保险客户管理系统
  • (力扣记录)235. 二叉搜索树的最近公共祖先
  • (企业 / 公司项目)前端使用pingyin-pro将汉字转成拼音
  • (四)库存超卖案例实战——优化redis分布式锁
  • (转) 深度模型优化性能 调参
  • .gitignore文件_Git:.gitignore
  • .Net Attribute详解(上)-Attribute本质以及一个简单示例
  • .net core 6 使用注解自动注入实例,无需构造注入 autowrite4net
  • .NET I/O 学习笔记:对文件和目录进行解压缩操作
  • .NET Standard 的管理策略
  • .NET 常见的偏门问题
  • .NET 设计模式—适配器模式(Adapter Pattern)
  • .net6使用Sejil可视化日志
  • .Net--CLS,CTS,CLI,BCL,FCL
  • .NET关于 跳过SSL中遇到的问题
  • .Net环境下的缓存技术介绍
  • .skip() 和 .only() 的使用
  • @Bean, @Component, @Configuration简析
  • @RequestBody与@ModelAttribute