当一个表单存在回显的情况下,使用自定义验证的时候发生错误。
主要表现是,只验证赋的初值。也就是说无论后续输入什么值,验证的时候都是用回显的值做的校验。
发生这种错误的情况,是因为你如下做了回显赋值。
this.addData.cpu = this.addData.spec.cpu;
想要成功验证,请如下赋值
this.addData = {
cpu:this.addData.spec.cpu
}
还有一种情况是,校验延迟,是因为作为密码的显示的值有问题,如addData.login是父组件传值,这个传值存在问题。
<el-col :span="24">
<el-form-item label="登录方式:">
<el-radio-group v-model="addData.login" @change="chooseLoginWay">
<el-radio :label="item.name" :key="index" v-for="(item, index) in loginWays" border> {{item.name}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12" v-if="addData.login == '密码'">
<cmp-form-item label="登录密码:" prop="password" validate="required,hostPassword" required-message="该字段为必填字段">
<el-input type="password" v-model="addData.password"></el-input>
</cmp-form-item>
</el-col>
<el-col :span="12" v-if="addData.login == '密码'">
<cmp-form-item label="确认密码:" prop="endPassword" validate="required" required-message="该字段为必填字段">
<el-input type="password" v-model="addData.endPassword"></el-input>
</cmp-form-item>
</el-col>
这个错误发生的原因不详,虽然第二种赋值比较麻烦,展示没找到更优的解决办法QWQ