el-form-item加rules
时间: 2023-08-27 11:08:33 浏览: 96
vue 添加和编辑用同一个表单,el-form表单提交后清空表单数据操作
在使用`el-form-item`时,可以通过添加`rules`属性来进行表单验证。引用中的示例代码展示了如何添加验证规则:
```
<el-form-item ref="coverImage" :label="$t('封面')" prop="coverFileCode">
<upload-img ref="coverFileCode" biz-type="adapterRoom" biz-dtl-type="cover" @uploadSuc="successFn" @remove="removeFn" />
</el-form-item>
```
在这个示例中,`el-form-item`中的`prop`属性指定了一个字段名(`coverFileCode`),并在`rules`中配置了验证规则。例如:
```
rules: {
coverFileCode: [
{ required: true, message: '请上传封面', trigger: 'blur' }
]
}
```
这样,在触发表单校验时,会根据`trigger`属性的值(这里是`blur`)来触发验证。如果验证不通过,会显示错误消息。
同样地,引用中的示例代码也展示了如何在`el-form-item`中添加`rules`属性来进行表单验证。
总结起来,`el-form-item`的`rules`属性可以用来定义表单字段的验证规则,包括是否必填、格式要求等。
阅读全文