title: Antd 4.0.0: How to use form.getFieldValue() and all form's APIs by `const [form] = Form.useForm`?
body: <p>I run React with Ant Design and am getting this error:</p>
  <blockquote>
  <p>Instance created by 'useForm' is not connect to any Form element. Forget to pass 'form' prop?</p>
  </blockquote>
  <p><img src="https://i.stack.imgur.com/55FHD.png" alt="Error image" /></p>
  <p>Code:</p>
  <pre class="lang-js prettyprint-override"><code>// .../services/index.js
  export { default as registerService } from './registerService'
  
  
  // .../services/registerService.js
  import axios from '../../../configs/api.service'
  
  const registerService = (form) =&gt; {
    return {
      validatePasswordAndConfirmPassword: async (rule, value) =&gt; {
        if (value &amp;&amp; value !== form.getFieldValue(['user', 'confirmPassword'])) {
          throw new Error('Password and Confirm Password must be same')
        }
      },
  
      register: async user =&gt; {
        const { data } = await axios.post('/users', user)
        const { _id, username } = data
        console.log('Register Success:', `User ${username} is created, You get ID: ${_id}`)
        return data
      },
    }
  }
  
  export default registerService
  
  // Register Component
  import React from 'react'
  import { Button, Form, Input } from 'antd'
  import { registerService } from '../../services/'
  
  const Register = () =&gt; {
    const [form] = Form.useForm()
    const service = registerService(form)
  
    const onFinish = async ({ user }) =&gt; {
      try {
        await service.register(user)
      } catch (err) {
        console.error('Register Failed:', err.response)
      }
    }
  
    const onFinishFailed = errorInfo =&gt; {
      console.error('Failed:', errorInfo)
    }
  
    return (
      &lt;&gt;
        &lt;Form {...layout}
              name=&quot;Register&quot;
              onFinish={onFinish}
              onFinishFailed={onFinishFailed}
              validateMessages={validateMessages}
        &gt;
          &lt;Form.Item
            name={['user', 'username']}
            label=&quot;Username&quot;
            rules={[
              { required: true },
            ]}
          &gt;
            &lt;Input /&gt;
          &lt;/Form.Item&gt;
          &lt;Form.Item
            name={['user', 'password']}
            label=&quot;Password&quot;
            rules={[
              { required: true },
              { validator: service.validatePasswordAndConfirmPassword },
            ]}
          &gt;
            &lt;Input.Password /&gt;
          &lt;/Form.Item&gt;
          &lt;Form.Item
            name={['user', 'confirmPassword']}
            label=&quot;Confirm Password&quot;
            rules={[
              { required: true },
              {/*{ validator: service.validatePasswordAndConfirmPassword },*/}
            ]}
          &gt;
            &lt;Input.Password /&gt;
          &lt;/Form.Item&gt;
          &lt;Form.Item {...tailLayout}&gt;
            &lt;Button type=&quot;primary&quot; htmlType=&quot;submit&quot;&gt;Submit&lt;/Button&gt;
          &lt;/Form.Item&gt;
        &lt;/Form&gt;
      &lt;/&gt;
    )
  }
  
  export default Register
  </code></pre>
  <p>how can I fix this bug?</p>