[Ant Design] Validatorは、カスタムフォーム送信ルールのコールバックメソッドとPromiseメソッドを実装します

シーン

フォームはフォーム送信に非常に便利で、さまざまな属性が役立ちます。
カスタムルールを実装する場合は、コールバックまたはPromiseを使用してフォームの送信をブロックできます。

コールバック方式

<Form.Item
    hasFeedback
    rules={
    
    [
        {
    
    
            validator: async (rule, value, callback)=>{
    
    
                // 请求判断用户是否存在
                let res = await that.certificate(value);
                if(res.status === 1)
                    callback('用户名已存在');
                else callback();
            },
        }
    ]}
>
</Form.Item>

しかし実際には、プロセスに関係なくコールバックを最終的に呼び出す必要があるため、promisの方が制御しやすくなっています。callback（ 'xxx' '）は検証に合格しなかったことを意味し、callback（）は検証に合格したことを意味します。 hasFeedbackの属性を追加すると、コールバックが√である限り、次のことがわかります。

約束の方法

<Form.Item
    hasFeedback
    rules={
    
    [
        {
    
    
            validator: async (rule, value)=>{
    
    
                // 请求判断用户是否存在
                let res = await that.certificate(value);
                if(res.status === 1)
                    return Promise.reject('用户名已存在');
                else return Promise.resolve('用户名可用');
            },
        }
    ]}
>
</Form.Item>