子组件：子组件 ( ChildRules ) 中正常写校验规则
<el-form :model="ruleForm" ref="ruleForm" label-width="120px">
<el-form-item label="物业公司名称：" prop="property.company_name" :rules="{ required: true, message: '物业公司名称不能为空', trigger: 'blur' }">
<el-input v-model="ruleForm.property.company_name" placeholder="" clearable></el-input>
</el-form-item>
<el-form-item label="邮箱：" prop="property.company_email" :rules="[{ required: true, message: '请填写邮箱地址', trigger: 'blur' }, { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }]" class="mt-10">
<el-input v-model="ruleForm.property.company_email" placeholder="" clearable></el-input>
</el-form-item>
</el-form>
子组件正常校验
// 校验数据
validateForm () {
let flag = null
this.$refs['ruleForm'].validate(valid => {
if (valid) {
flag = true
} else {
flag = false
}
})
return flag
}
父组件:
<child-rules ref="childRules"></child-rules>
<script>
let flag = this.$refs['childRules'].validateForm()
</script>
