el-form的表单验证不生效

之前表单验证总是返回true不生效，没注意v-if的原因，记录一下

1.原因

1）prop和model绑定的数据名称和rules名称一致;
2）表单验证ref值唯一;
3）使用v-if表单的验证失效一直返回true；在el-form-item加上key值;或者使用v-show来渲染

2.el-form部分

验证规则rules。

//form
form:any ={
	sponsorId: 0,
}
//rules验证规则
 rules: any = {
    sponsorId: [{ required: true, message: "客户名称是必填项" ,trigger: 'blur'}],
  };

表单验证方法。

async validate(){
	var valid = await (this.$refs["form"] as ElForm).validate();
    // console.log("object :>> ", this.form.sponsorId,);
    return new Promise((resolve) => {
      // 校验通过返回表单数据，反之，返回null
      if (valid) {
        resolve(this.form);
      } else {
        resolve({});
      }
    });
}

vue页面。

 
         
          
            
              
                
                
              
            
            
              {{
                renderValue(renderValue(form.sponsorName))
              }}