1.form表单中
<el-form :model="dynamicValidateForm" ref="dynamicValidateForm" label-width="100px" class="demo-dynamic">
<el-form-item
label="邮箱"
prop="email"
:rules="[
{ required: true, message: '请输入邮箱地址', trigger: 'blur' },
{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
]"
>
<el-input v-model="dynamicValidateForm.email"></el-input>
</el-form-item>
<el-form-item
v-for="(domain, index) in dynamicValidateForm.domains" :label="'域名' + index" :key="domain.key"
:prop="'domains.' + index + '.value'"
:rules="{
required: true, message: '域名不能为空', trigger: 'blur'
}"
>
<el-input v-model="domain.value"></el-input>
</el-form-item>
</el-form>2.data中文章来源：https://www.toymoban.com/news/detail-716608.html
dynamicValidateForm: {
domains: [{
value: ''
},
{
value: ''
},
{
value: ''
},
{
value: ''
}
],
email: ''
}3.提交前触发校验文章来源地址https://www.toymoban.com/news/detail-716608.html
this.$refs["dynamicValidateForm"].validate();
到了这里，关于vue el-form-item :rules动态校验实现的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
