关于antd的表单验证

最新推荐文章于 2024-09-26 10:57:35 发布

转载最新推荐文章于 2024-09-26 10:57:35 发布 · 237 阅读

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/marvelousone/p/11215946.html

有时候验证不了，可能需要加上submitting

const {
     form: { getFieldDecorator },
     submitting,
   } = this.props;

<Button type="primary" htmlType="submit" onSubmit={this.submit} loading={submitting} >

有时候发现验证不生效，点击了提交但是没反应。
原因是自定义验证规则写错了。

{
    getFieldDecorator('contactPhone', {
        initialValue: baseInfo.contactPhone,
        rules: [
           {
               required: true,
                message: '联系人手机为必填项' 
           },
           { validator: this.checkPhoneNub }//自定义检验
        ],
    })(
    <Input 
        style={{width:220}} 
        autoComplete="off"
    ></Input>
    )
}

下面是自定义验证规则

checkPhoneNub(rule, value, callback) {
    var regu = "^1[0-9]{10}$";//手机号码验证regEx:第一位数字必须是1，11位数字
    var re = new RegExp(regu);
    if ( re.test(value)) {
      callback();
    }else {
        callback('请正确输入手机号！');
    }
  }

转载于:https://www.cnblogs.com/marvelousone/p/11215946.html