antd form组件如果通过axios api校验？

Question

比如一些重名的校验，需要通过axios才能到后端获取到结果，由于antd的校验是每次input框有改动而触发的，这样频繁调的网络调用会有很大的性能问题，有没有方法控制调用的频率？

        validateDupName (name) {
           axios.get(/api-path/)..... 通过api查询后端是否有重名
        }
        
        <FormItem
          label="名称"
          {...formItemLayout}
        >
          {getFieldDecorator('name', {
            rules: [
              {
                validator: validateDupName
              }
            ],
          })(
            <Input placeholder="名称"/>
          )}
        </FormItem>
        

Answer 1

debounce
虽然form在监控你的input是否符合rule，但是你依旧可以监听这个input的onChange事件，所以在input的onChange事件里绑定去后端验证的请求方法。再用debounce包装下，控制频率即可。
当你的请求返回失败时，可以调用setFields，添加antd的form式的错误

Answer 2

首先 antd input的校验由于你设置的rules而定的, 这个rules基本上都只是校验是否输入规范, 而你需要校验是否重名可以通过onBlur