title: Why I can not use inline function in component prop? Can you explain in detail by giving an example? What means saying losing all state?
body: <p>Note: The component prop accepts component, not a render function. Don't pass an inline function (e.g. component={() =&gt; }), or your component will unmount and remount losing all state when the parent component re-renders. See Passing additional props for alternatives.</p>
  <p>This warning from the simulator.
  <a href="https://i.stack.imgur.com/6wJ7v.png" rel="nofollow noreferrer">enter image description here</a></p>
  <pre><code>function HomeScreen(props: Object) {
    return (
      &lt;Navigator initialRouteName=&quot;Empty1&quot;&gt;
        &lt;Screen
          name=&quot;Empty1&quot;
          component={() =&gt; {
            return (
              &lt;View&gt;
                &lt;Text&gt;Example Text&lt;/Text&gt;
              &lt;/View&gt;
            );
          }}
        /&gt;
        &lt;Screen name=&quot;Home1&quot; component={HomeScreen1} /&gt;
      &lt;/Navigator&gt;
    );
  }
  </code></pre>