如何使用ant-design表单进行数据处理、调用常用方法及实现自定义验证操作？

本文共计2901个文字，预计阅读时间需要12分钟。

首先，要说明BantDesign这个框架API和demo内容丰富，且开发环境提供的warning能有效纠正用户的错误。这是一个非常优秀的组件库。关于表单验证方面，依赖于async-validator库。百度的san-xui组件库也提供了类似的功能。

首先要说一下antdesign这个框架API和demo丰富，而且开发环境提供对应的warning来纠正用户的错误。是一个很好的组件库。

关于表单验证方面是依赖于 async-validator 库。百度的san-xui组件库的表单验证也是依赖与async-validator。说明这个库的实用性还是比较高，可以多了解一下。

首先按照antDesign官网Demo。我们可以copy一个Form表单的demo。 LoginForm是表单的组件，下面代码，是React 高阶组件（Hoc）。 用于使组件获取 this.props.form

下面介绍一些常用的 this.props.form的方法。

const { form } = this.props

form.resetFields() 用于清空输入空

form.validateFields 用于验证

1.给输入框添加 键名。rules 规定输入规则。