How to use antd.Form.create in typescript?

Import the FormComponentProps

import {FormComponentProps} from 'antd/lib/form/Form';

Then have your component

interface YourProps {
    test: string;
}        

class YourComponent extends React.Component<YourProps & FormComponentProps> {
    constructor(props: YourProps & FormComponentProps) {
        super(props);
        ...
    }
}

Then export the class using Form.create()
```
export default Form.create<YourProps>()(YourComponent);
```
The generic argument on Form.create casts the result to a React ComponentClass with YourProps - without FormComponentProps, because these are being injected through the Form.create wrapper component.

I got a better approach from antd documentation

import { Form } from 'antd';
import { FormComponentProps } from 'antd/lib/form';

interface UserFormProps extends FormComponentProps {
  age: number;
  name: string;
}

class UserForm extends React.Component<UserFormProps, any> {
  // ...
}

const App = Form.create<UserFormProps>({
  // ...
})(UserForm);

Tags:

Forms

Typescript

Antd

Related