react antd form表单校验

官方文档：antd Rule

<Form.Item
  label={t('shark-blacklist')}
  name="blacklist"
  initialValue={projectData?.blacklist.toString() || undefined}
  rules={[
    {
      required: false,
      message: t('shark-blacklist-tip') as string,
      pattern: /^([A-Za-z0-9@]+,)*[A-Za-z0-9@]+$/g, // 方法一
    },
    { // 方法二
      validator: (rule, value) => {
        console.log('rule:', rule)
        const reg = /^([A-Za-z0-9@]+,)*[A-Za-z0-9@]+$/g;
        if (!reg.test(value)) {
          return Promise.reject(new Error(t('shark-blacklist-tip') as string));
        }
        return Promise.resolve();
      },
    },
  ]}
>
  <Input placeholder={t('shark-blacklist-tip') as string} />
</Form.Item>

注意事项：

• Form.Item需要给定name属性；
• Form.Item里面只能包含一个子组件；

Ant Form使用总结 —— 校验