title: Async form field validation in ant design
body: <p>How to validate form fields asynchronously in ant design?</p>
  
  <pre><code> &lt;FormItem&gt;
       {getFieldDecorator('zipcode', {
         initialValue: `${customer &amp;&amp; customer.zipcode ? customer.zipcode : ''}`,
         rules: [
           // { required: true, message: 'Please input your Zipcode' },
           { validator: this.handlezipCodeChange },
         ],
       })(
         &lt;Input
           prefix={
             &lt;Icon type="zipcode" style={{ color: 'rgba(0,0,0,.25)', visibility: 'hidden' }} /&gt;
           }
           type="number"
           placeholder="Zipcode"
           // onChange={this.handlezipCodeChange}
         /&gt;
       )}
  &lt;/FormItem&gt;
  </code></pre>
  
  <p><strong>function call</strong></p>
  
  <pre><code>  handlezipCodeChange = (rule, value, callback) =&gt; {
      if (!value) {
        callback('Please input your zipcode');
      }
      if (value.length &lt; 5) {
        callback('Please enter minimum length of 5');
      }
      if (value.length &gt; 5) {
        callback('Please enter maximum length of 5');
      }
      if (value.length === 5) {
        const validateZipCode = validateZipcode(value);
        if (
          validateZipCode &amp;&amp;
          validateZipCode.result &amp;&amp;
          validateZipCode.result.zipcodeInfo === null
        ) {
          callback('Seems to be Invalid Zipcode');
        } else {
          callback();
        }
      }
    };
  
  export async function validateZipcode(zipcode) {
    return request(`/api/getZipcodeInfo?zipcode=${zipcode}`);
  }
  </code></pre>
  
  <p>How to show the error message from api response? As api call takes some time to complete at that time the validation function call get executed completely before api request complete. So how can i show the error message?</p>