title: How the data of Form.Item is propagated to its children component and whats the best way to define custom component for Form.Item in Antd?
body: <p>How the data of current Form.Item is propagated to its children component,
  I have code something like ---&gt;</p>
  <pre><code>&lt;Form.Item noStyle name={id}&gt;
    &lt;UserName/&gt;
  &lt;/Form.Item&gt;
  </code></pre>
  <p>and it is defined like --&gt;</p>
  <pre><code>const UserName = ({value = {}}) =&gt; {
    return (&lt;span&gt;{users.data.find(u =&gt; u.id === value).name}&lt;/span&gt;);
  };
  </code></pre>
  <p>Above code works fine… but my question is,
  How can you define it instead of another Component inside same Form.item , for example something like --</p>
  <pre><code>&lt;Form.Item
    style={{marginRight: '80px'}}
    name={id}
  &gt;
    ......
    ......
    ......
    ......
  &lt;/Form.Item&gt;
  </code></pre>