Ant 设计版本4表格

Question

How to read and validate <Form.Item> value in children component

In Ant 3.XX

we can pass form prop directly into the children component

<ChildrenComponent formProp={form} />

const ChildrenComponent = (props) => {

    const form = props.formProp.form

    <Form.Item>
        {form.getFieldDecorator(questionData._id, {
        rules: [{ validator: handleTextValidate }],
        })(<TextArea rows={4} onChange={handleChange} />)}
    </Form.Item>

}

but in Ant 4.XX, there is no form.getFieldDecorator

what should I do, to make <Form.Item> in children component controlled by Form component in parent component?

// parent

<Form>

    <ChildrenComponent />

</Form>

// children

<Form.Item>

    <Input />

</Form.Item>

Answer 1

I think you can use the getFieldInstance method to achieve that.

https://ant.design/components/form/#FormInstance

Answer 2

Solved

Parent:

import {Form} from 'antd'

<ChildrenComponent formProp={Form} />

Children:

const Form = props.formProp

<Form.Item> <Form.Item/>