elementUI中,当el-form表单只存在一个el-input框时,在输入框中按下回车会提交该表单,会触发表单的默认提交事件。
在W3C 标准中:
When there is only one single-line text input field in a form, the user agent should accept Enter in that field as a request to submit the form.
当一个 form 表单中只有一个输入框时,在该输入框中按下回车应提交该表单。如果希望阻止这一默认行为,可以在 form 标签上添加 @submit.native.prevent。
@submit.native.prevent
.native 表示对一个组件绑定系统原生事件
.prevent 表示提交以后不刷新页面
所以:
<el-form :model="form" @submit.native.prevent>
或
<el-form :model="form" @submit.prevent>
另外
Vue.js 为 v-on 提供了事件修饰符。修饰符是由点开头的指令后缀来表示的。
- stop :阻止事件冒泡
- prevent :阻止默认事件发生,比如超链接的默认跳转、表单的提交(重点)
- self :只有元素自身触发事件才执行。(子元素的事件冒泡来的不执行)
- once :只执行一次