title: Reference a React Element before its declared in JSX
body: <p>I am implementing <a href="https://github.com/wix/react-native-zss-rich-text-editor" rel="nofollow noreferrer">react-native-zss-rich-text-editor</a> in my project and am having a issue where the <code>RichTextToolbar</code> needs a function that returns a ref to a <code>RichTextEditor</code> component.</p>
  <p>If I order the RichTextEditor before the RichTextToolbar it works fine</p>
  <pre><code>&lt;RichTextEditor
    ref={(r) =&gt; this.richtext = r}/&gt;
  &lt;RichTextToolbar
      getEditor={() =&gt; this.richtext}/&gt;
  </code></pre>
  <p>But I would like to first render the <code>RichTextToolbar</code> and then the <code>RichTextEditor</code> which throws an exception</p>
  <pre><code>    &lt;RichTextToolbar
          getEditor={() =&gt; this.richtext}/&gt;  &lt;-----
      &lt;RichTextEditor
        ref={(r) =&gt; this.richtext = r}/&gt;
     
  </code></pre>