Antd如何接收Form组件的函数<此功能仅限Antd v3版本

1. 在React项目中，我们需要在Modal对话框中展示一个form表单的功能，此时我们要拿到封装的form函数和输入的value值？那么我们要分为几步做！

1.1 假设我们封装了from表单<暂时命名为：AddUpdateForm>

   注：传递form函数时必须在子组件中声明类型，PropTypes 提供一系列验证器，可用于确保组件接收到的数据类型是有效的。当传入的 prop 值类型不正确时，JavaScript 控制台将会显示警告。出于性能方面的考虑

import React, { Component } from 'react'
import PropTypes from 'prop-types'
import {
  Form,
  Input
} from 'antd'
const Item = Form.Item
class AddUpdateForm extends Component {
*注：传递form函数时必须在子组件中声明类型
static propTypes = {
    setForm: PropTypes.func.isRequired,
    categoryName: PropTypes.string,
  }
/* 
添加/修改分类的Form组件
*/
  render() {
    const { getFieldDecorator } = this.props.form
    const { categoryName } = this.props
    return (
      <Form>
        <Item>
          {
            getFieldDecorator('categoryName', {
              initialValue: categoryName || '',
              rules: [
                {required: true, message: '分类名称必须输入'}
              ]
            })(
              <Input type="text" placeholder="请输入分类名称"></Input>
            )
          }
        </Item>
      </Form>
    )
  }
}

export default Form.create()(AddUpdateForm)

*1.2:在父组件页面中引入form子组件后需要设置一个函数名来接收函数<函数名: setForm={form=>this.form=form}>

*1.2.1:注 > 对象体中是将获取的子组件中的form对象赋值传给父组件的form中

import React, { Component } from 'react'
import {
  Card, 
  Table,
  Modal
} from 'antd'
import AddUpdateForm from './add-update-form'
export default class Category extends Component {
  /* 
    点击确定的回调: 去添加/修改分类
  */
  handleOk = () => {
    // 进行表单验证
    this.form.validateFields(async (err, values) => {
      if (!err) {
        // 验证通过后, 得到输入数据
        const { categoryName } = values
        const {showStatus} = this.state
        this.form.resetFields() // 重置输入数据(变成了初始值)
        // 根据响应结果, 做不同处理
      }
    })
  }
  render() {
    return (
      <Card extra={extra}>
        <Table />
        <Modal>
          <AddUpdateForm setForm={form => this.form = form} categoryName={category.name}/>
        </Modal>
      </Card>
    )
  }
}

此时就可以直接调用this.form获取子组件中的输入值函数方法