React Hooks非相关组件传参（antd 3.X）

说明

使用antd 3.X，在父组件在拿到子组件的input框的value值，具体实现如下：

父组件

import React, { useState, useEffect } from "react";
import { Card, Button, Icon, Table, Modal } from "antd";
import UpdateForm from "./updateForm";
function Category() {
  // 确认修改OK
  const updateCategory = () => {
    updateValue.validateFields(async (err, values) => {
      if (!err) {
        console.log(values);
      }
    });
  };
  return (
    <div>
        <Modal
          title="修改信息"
          visible={visible === 2}
          onOk={updateCategory}
          onCancel={handleCancel}
        >
          <UpdateForm
            categoryName={categoryName}
            setForm={(form) => {
              setUpdateValue(form);
            }}
          />
        </Modal>
    </div>
  );
}

export default Category;

子组件

import React, { useEffect } from "react";
import { Form, Input } from "antd";
function UpdateForm(props) {
  const { getFieldDecorator } = props.form;
  const handleSubmit = () => {};
  useEffect(() => {
    props.setForm(props.form);
  }, []);
  return (
    <div>
      <Form onSubmit={handleSubmit} className="login-form">
        <Form.Item>
          {getFieldDecorator("categoryName", {
            initialValue: props.categoryName, //初始化数据
            rules: [{ required: true, message: "分类名称" }],
          })(<Input placeholder="请输入名称" />)}
        </Form.Item>
      </Form>
    </div>
  );
}

export default Form.create()(UpdateForm);