Ant Disign 4.0 升级实践Form (对表单数据域进行交互)

Form v3 & v4
去除 Form.create
v4 的 Form 不再需要通过 Form.create() 创建上下文。Form 组件现在自带数据域,因而 getFieldDecorator 也不再需要,直接写入 Form.Item 即可:

//antd v3

const Demo = ({ form: { getFieldDecorator } }) => (
  <Form>
    <Form.Item>
      {getFieldDecorator('username', {
        rules: [{ required: true }],
      })(<Input />)}
    </Form.Item>
  </Form>
);

const WrappedDemo = Form.create()(Demo);

改成:

// antd v4

const Demo = () => (
  <Form>
    <Form.Item name="username" rules={[{ required: true }]}>
      <Input />
    </Form.Item>
  </Form>
);

由于移除了 Form.create(),原本的 onFieldsChange 等方法移入 Form 中,通过 fields 对 Form 进行控制。

上一篇:Linux 软件包:man pages


下一篇:使用react中antd design UI库from中的getFieldsValue,getFieldValue,validateFields,resetFields,getFieldDecorat