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

el-form里面的input输入框按回车自动刷新页面的问题

在el-form中,如果只有一个input的话,按回车表单会自动提交,刷新页面

解决方案:

1.只有一个的话直接不用el-form表单;

2.给input加上停止回车的事件

 <el-input v-model="searchDetailData.Name" placeholder="请输入工作内容" clearable @keydown.native="handleEnter"></el-input>

  handleEnter(event) {

    if (event.keyCode === 13) {

      event.preventDefault(); // 阻止默认行为

    }

  },

3.在 <el-form> 上添加 @submit.native.prevent 来阻止表单的默认提交行为

<el-form label-width="100px" @submit.native.prevent>

4.在表单中使用 @keydown.enter.native.prevent

<el-form label-width="100px" @keydown.enter.native.prevent>

http://www.dtcms.com/a/149360.html

相关文章:

  • Hyper-V 管理工具
  • 12.5/Q1,GBD高分文章解读
  • 深度强化学习 pdf 董豪| 马尔科夫性质,马尔科夫过程,马尔科夫奖励过程,马尔科夫决策过程
  • 香港免费云服务器申请教程,配置4核8G
  • 制作一款打飞机游戏17:敌人
  • G1 人形机器人软件系统架构与 Python SDK
  • SystemV-消息队列与责任链模式
  • Discuz!+DeepSeek:传统论坛的智能化蜕变之路
  • 鸿蒙移动应用开发--渲染控制实验
  • C++异步操作 - future async package_task promise
  • Vue项目依赖注入的使用
  • 深度学习模型搭建的基础原理详细介绍
  • C++学习笔记(三十六)——STL之排序算法
  • Java中内部类
  • 电脑硬盘丢失怎么找回?解决硬盘数据恢复的2种方法
  • win10中打开python的交互模式
  • c++STL——stack、queue、priority_queue的模拟实现
  • 【Linux】46.网络基础(3.3)
  • linux下使用wireshark捕捉snmp报文
  • GAEA的技术优势:分层加密与去中心化数据治理
  • 若依SpringCloud项目-定制微服务模块
  • macOS安全隐私最佳实践分析
  • Mujoco xml < sensor>
  • SEO长尾关键词优化核心策略
  • 【Vue】状态管理(Vuex、Pinia)
  • 深度学习训练中的显存溢出问题分析与优化:以UNet图像去噪为例
  • yaml里的挪威问题是啥
  • day3 打卡训练营
  • 编程思想之分片
  • JavaScript 笔记 --- part 5 --- Web API (part 3)