react ant From 实时验证 和 提交时统一验证

一、表单提交时 统一验证 
思路：首先form的item上有自己的onchange验证事件，通常都是 数字、非空、长度  等ant 内置验证规则，第二种方法 是添加这种自定义 规则
单机事件中使用 validateFields(errors, values) 内置方法，会获取到form中已有验证的错误和值。然后在中写自己的 验证方法。最后统一判断。
思路比较清晰简单，但是写的时候来回倒腾，费了好大劲，记录


提交时验证代码：

validateFields((errors, values)

 myForm.validateFields((errors, values) => {

            let flag = true;
            //验证sql的可执行性
            let SQL = values.SQL;
            let Code = values.Code;
            auth.Ajax("/check/checkSQL", { SQL: SQL, Code: Code }, function (res) {
                 console.log(res);
                if (res.result == '1') {  //返回正常参数
                    flag = false;
                    myForm.setFields({	//设置验证返回错误
                        SQL: {
                            value: SQL,
                            errors: [new Error(res.data)],
                        },
                    });
                }else{
                    flag = true ;
                    myForm.setFields({	//设置删除上一次错误信息
                        SQL: {
                            value: SQL,
                            errors: null,
                        },
                    });
                }

            });
       
            if (errors || !flag) {
                console.log('Errors in form!!!');
                return;


            }else{
                console.log('No Errors in form!!!');
            }

二、单个item 实时验证，相当于onchange时间中些方法 

特点：实时验证，只要该字段一改变就会调用这个方法。

定义的验证方法

checkConfirm(rule, value, callback) {
          auth.ajax("/briefing/checkSQL", { SQL: value, Code: "DS" }, function (res) {
                   
                    if (res.result == '1') {
                        console.log("set error");
                        callback("SQL错误，请修改！");
                    }
             });
            
        callback();
    }

在 item中定义这个规则    { validator: this.checkConfirm }

	<FormItem
               {...formItemLayout}
               label={"查询SQL"}
               hasFeedback>
               {getFieldDecorator('SQL', {
                      rules:[{ required: true, message: '简报时机必须选择', }, { validator: this.checkConfirm }], 
                      initialValue: this.state.data.SQL
               })(
            	<Input type="textarea" onChange={this.handleSqlChange.bind(this)}  autosize={{minRows: 2, maxRows: 6}} disabled={(isDisabled)} />
               )}
         </FormItem>