elementUI 输入框按回车刷新页面问题

分析原因:

当 el-form 表单内只有一个 el-input 输入框时,且type为text类型时,在输入框内按回车就会触发表单的提交事件。

而当 el-form 表单内有多个 el-input 输入框时,按回车不会执行任何操作。

使用.prevent修饰符来阻止默认的表单提交行为:

@submit.native.prevent注解添加到el-form标签上从而阻止了按下回车键时的页面刷新

.native 表示对一个组件绑定系统原生事件

.prevent 表示阻止默认事件(如form的submit事件默认提交会刷新页面,.prevent修饰符可以阻止该默认事件)

html 复制代码
<el-form @submit.native.prevent>
  <el-form-item>
    <el-input v-model="input" placeholder="请输入内容"></el-input>
  </el-form-item>
</el-form>
相关推荐
C_心欲无痕17 小时前
前端如何实现 [记住密码] 功能
前端
qq_316837751 天前
uni.chooseMedia 读取base64 或 二进制
开发语言·前端·javascript
Zoey的笔记本1 天前
2026告别僵化工作流:支持自定义字段的看板工具选型与部署指南
大数据·前端·数据库
小二·1 天前
Python Web 开发进阶实战:混沌工程初探 —— 主动注入故障,构建高韧性系统
开发语言·前端·python
gis开发1 天前
【无标题】
java·前端·javascript
小二·1 天前
Python Web 开发进阶实战:低代码平台集成 —— 可视化表单构建器 + 工作流引擎实战
前端·python·低代码
慧一居士1 天前
Vite 中配置环境变量方法及完整示例
前端·vue.js
天意pt1 天前
Idempotency 幂等性 - 点赞和投票功能
前端·javascript·express
weixin_427771611 天前
cursor 智能commit
前端
努力的小陈^O^1 天前
问题:Spring循环依赖问题排查与解决
java·开发语言·前端