async-validator中对象的深度验证
<el-form :inline="true" :model="ruleForm" label-width="110px" ref="ruleForm" :rules="rules" style="width:90%;margin:0 auto"> <el-card> <div slot="header"> <span>基本信息</span> </div> <div> <div> <el-form-item label="名字:" prop="human.name"> <el-input v-model="ruleForm.human.name"></el-input> </el-form-item> <el-form-item label="性别:" prop="human.sex"> <el-input v-model="ruleForm.human.sex"></el-input> </el-form-item> </div> <div> <el-form-item label="dog:" prop="dog"> <el-input v-model="ruleForm.dog"></el-input> </el-form-item> </div> </div> </el-card> <el-form-item style="margin-top:20px;float:right"> <el-button type="primary" @click="submitForm('ruleForm')" >确定</el-button> <el-button >取消</el-button> </el-form-item> <div class="clear"></div> </el-form>
data(){ return{ ruleForm:{ human:{ name:'', sex:0, }, dog:'', } } rules:{ dog: { required: true, message: '请填写dog', trigger: 'blur' }, //type默认是string 'human.name':[{type: "string", required: true, message: '请填写名字', trigger: 'blur'}], //有多条校验条件的时候可以放个object数组 'human.sex':{ type: "string",required: true, message: '请填写性别', trigger: 'blur'}, }, }