在文档 https://ant.design/docs/react/migration-v4 中没有提到 antd 中的 Form.create() 被替换的问题。所以可以认为 Form.create() 还是可以继续使用的。
以下是一个使用 antd Form.create() 方法的示例:
import React from 'react';
import { Form, Input, Button } from 'antd';
class MyForm extends React.Component {
handleSubmit = e => {
e.preventDefault();
this.props.form.validateFields((err, values) => {
if (!err) {
console.log('Received values of form: ', values);
}
});
};
render() {
const { getFieldDecorator } = this.props.form;
return (
{getFieldDecorator('username', {
rules: [{ required: true, message: 'Please input your username!' }],
})(
)}
);
}
}
const WrappedMyForm = Form.create({ name: 'my_form' })(MyForm);
export default WrappedMyForm;
在上面的示例中,通过 Form.create({ name: 'my_form' })
方法来创建一个高阶组件,然后通过 this.props.form
可以获取到包含一些用于表单操作的方法和字段验证的规则。