ant Design表单验证笔记

1、pattern正则验证

<Col md={12} sm={24}>
                <FormItem {...formItemLayout} label="班数">
                  {form.getFieldDecorator('classNum', {
                    rules: [{ required: true, message: '请输入开设班数' },
                    {
                      pattern:new RegExp(/^[0-9]*$/),
                      message:'请输入正确的开设班数'
                    }],
                  })(<Input placeholder="请输入开设班数" />)}
                </FormItem>
              </Col>

2、validator自定义校验

const validateEnrollTimelChange = (rule, value, callback) => {
      if (value && value !== form.getFieldValue('enrollStartTime')) {
        const startime = value.format('YYYY-MM-DD HH:mm');
        const endtime = form.getFieldValue('enrollStartTime').format('YYYY-MM-DD HH:mm');
        if (startime && endtime >= startime) {
          callback('报名结束时间不能小于报名开始时间');
        } else {
          callback();
        }
      } else {
        callback();
      }
    };
<FormItem {...formLayout} label="报名结束时间">
                {getFieldDecorator('enrollEndTime', {
                  rules: [
                    { required: true, message: '请输入报名结束时间' },
                    {
                      validator: validateEnrollTimelChange,
                    },
                  ],
                  initialValue: manageData.enrollEndTime,
                })(
                  <DatePicker
                    style={{ width: '100%' }}
                    disabled={opertype === 'detial' || examStatus === 3 || examStatus === 4 || examStatus === 5}
                    format="YYYY-MM-DD HH:mm"
                    showTime
                  />
                )}
              </FormItem>