如何使用 getfiledecoder 在 ant design 中验证 url答案

【问题标题】：How Validate a url in ant design using getfiledecoder如何使用 getfiledecoder 在 ant design 中验证 url
【发布时间】：2019-11-26 04:11:01
【问题描述】：

我希望实现 ant design url 验证。使用getfiledecoder如何做url验证。

 <Form.Item label={label}>
        {getFieldDecorator(fieldName, {
          initialValue: initialValue,
          rules: [
            {
              required: true,
              whitespace: true,
              message: errorMessage,
              defaultField: { type: 'url' },
            },
          ],
        })(<Input placeholder={placeholder} className={'form-item input-lg'} />)}
      </Form.Item>

我无法进行网址验证

【问题讨论】：

标签： reactjs validation antd

【解决方案1】：

我将您的代码稍微修改为它们在此处的 ant 设计示例中显示的内容： https://ant.design/components/form/

这里的验证器类型：

https://github.com/yiminghe/async-validator#type

 <Form.Item label={label}>
   {getFieldDecorator(fieldName, {
     initialValue: initialValue,
     rules: [
       {
         required: true,
         whitespace: true,
         message: errorMessage,
         type: 'url',
       },
     ],
    })(<Input placeholder={placeholder} className={'form-item input-lg'} />)}
 </Form.Item>

【讨论】：

【解决方案2】：

她是url的规则。

rules: [
        {
            required: true,
            message: "This field is required."
        },
        {
            type: "url",
            message: "This field must be a valid url."
        }
    ]

【讨论】：