el-form trigger
时间: 2023-09-13 12:02:35 浏览: 96
el-form 多层级表单的实现示例
el-form 是一个基于 Element UI 的表单组件,它提供了一些常用的表单验证和提交功能。trigger 是 el-form 组件的一个属性,用于指定触发表单校验的事件。
trigger 属性有两个可选值:
- blur:在输入框失去焦点时触发表单校验。
- change:在输入框值发生改变时触发表单校验。
通过设置 trigger 属性,可以控制 el-form 组件何时进行表单校验。默认情况下,trigger 属性值为 'change',即在输入框值改变时触发表单校验。如果需要在输入框失去焦点时触发表单校验,可以将 trigger 属性设置为 'blur'。
例如,在 el-form 组件中设置 trigger 属性为 'blur':
```html
<el-form :model="form" :rules="rules">
<el-form-item label="用户名" prop="username">
<el-input v-model="form.username" auto-complete="off" placeholder="请输入用户名" @blur="$refs.form.validateField('username')"></el-input>
</el-form-item>
<!-- 其他表单项 -->
<el-form-item>
<el-button type="primary" @click="submitForm">提交</el-button>
</el-form-item>
</el-form>
```
在上述示例中,当用户名输入框失去焦点时,会通过 `@blur` 事件触发 `validateField` 方法对该字段进行校验。`validateField` 方法会根据所传入的字段名进行校验。
阅读全文