title: React Navigation V5 Conditional Navigator screens based on async storage value
body: <p>Using the following <a href="https://reactnavigation.org/docs/auth-flow/" rel="nofollow noreferrer">guide</a> for react navigation V5</p>
  
  <p>I have add a a welcome screen and home screen to a stack navigator
  and I have a token in <a href="https://github.com/react-native-community/async-storage" rel="nofollow noreferrer">Async Storage</a> to check the value of the token</p>
  
  <p>if the token is true navigator should render home
  and if its null it will render the welcome screen</p>
  
  <p>now as async storage as asynchronous welcomeScreen is rendered
  at every launch of the app.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>let check = null
  getData = async () =&gt; {
  try {
  const value = await AsyncStorage.getItem('@firstLaunch')
  if(value !== null) {
  check === value
  }
  } catch(e) {
  // error reading value
  }
  }
  
  return (
  &lt;Stack.Navigator&gt;
  {check === null ? (
  // No token found, render welcome screen
  &lt;Stack.Screen
  name="welcome"
  component={WelcomeScreen}
  }}
  /&gt;
  ) : (
  // render HomeScreen
  &lt;Stack.Screen name="Home" component={HomeScreen} /&gt;
  )}
  &lt;/Stack.Navigator&gt;
  );
  
      let check = null
  getData = async () =&gt; {
  try {
  const value = await AsyncStorage.getItem('@firstLaunch')
  if(value !== null) {
  check === value
  }
  } catch(e) {
  // error reading value
  }
  }
  
  return (
  &lt;Stack.Navigator&gt;
  {check === null ? (
  // No token found, render welcome screen
  &lt;Stack.Screen
  name="welcome"
  component={WelcomeScreen}
  }}
  /&gt;
  ) : (
  // render HomeScreen
  &lt;Stack.Screen name="Home" component={HomeScreen} /&gt;
  )}
  &lt;/Stack.Navigator&gt;
  );</code></pre>
  </div>
  </div>
  </p>