Correctly creating an antd Form using the extends React.Component mechanism
<p>I am trying to reproduce the antd Form example in <a href="https://github.com/ant-design/ant-design/blob/master/components/form/demo/horizontal-login.md" rel="noreferrer">https://github.com/ant-design/ant-design/blob/master/components/form/demo/horizontal-login.md</a></p>

<p>Replacing React.createClass with extends React.Component but I am getting a Uncaught TypeError: Cannot read property 'getFieldDecorator' of undefined</p>

<p>with the following code:</p>

<pre><code>import { Form, Icon, Input, Button } from 'antd';
const FormItem = Form.Item;

export default class HorizontalLoginForm extends React.Component {
    constructor(props) {
        super(props);
    }

  handleSubmit(e) {
    e.preventDefault();
    this.props.form.validateFields((err, values) =&gt; {
      if (!err) {
        console.log('Received values of form: ', values);
      }
    });
  },
  render() {
    const { getFieldDecorator } = this.props.form;
    return (
      &lt;Form inline onSubmit={this.handleSubmit}&gt;
        &lt;FormItem&gt;
          {getFieldDecorator('userName', {
            rules: [{ required: true, message: 'Please input your username!' }],
          })(
            &lt;Input addonBefore={&lt;Icon type="user" /&gt;} placeholder="Username" /&gt;
          )}
        &lt;/FormItem&gt;
        &lt;FormItem&gt;
          {getFieldDecorator('password', {
            rules: [{ required: true, message: 'Please input your Password!' }],
          })(
            &lt;Input addonBefore={&lt;Icon type="lock" /&gt;} type="password" placeholder="Password" /&gt;
          )}
        &lt;/FormItem&gt;
        &lt;FormItem&gt;
          &lt;Button type="primary" htmlType="submit"&gt;Log in&lt;/Button&gt;
        &lt;/FormItem&gt;
      &lt;/Form&gt;
        )
    }
}
</code></pre>

<p>Looks like the missing Form.create part is causing the issue, but don't know where it fits using the extends mechanism.</p>

<p>How can I properly do it ?</p>