title: React native switch between screens based on login token
body: <p>I am building a react native app and I am new to it. I have 3 files currently - </p>
  
  <p>1) App.js</p>
  
  <p>2) Login.js</p>
  
  <p>3) FlightList.js</p>
  
  <p>When I have not logged in, I need to show login screen. When I log in, I need to store the token and display Flights list screen.</p>
  
  <p>This is my code - </p>
  
  <p>App.js</p>
  
  <pre><code>import React, { Component } from 'react';
  import {
    Platform,
    StyleSheet,
    Text,
    View
  } from 'react-native';
  import { StackNavigator } from 'react-navigation';
  import Login from './Login';
  
  export default class App extends React.Component {
    render() {
      return (
        &lt;View style={styles.container}&gt;
          //Check if token is there and if there show flight list screen else login screen
        &lt;/View&gt;
      );
    }
  }
  </code></pre>
  
  <p>Login.js</p>
  
  <pre><code>'use strict';
  import React, { Component } from 'react';
  import {
    StyleSheet,
    TextInput,
    TouchableHighlight,
    AsyncStorage,
    Text,
    View
  } from 'react-native';
  import {
      StackNavigator,
    } from 'react-navigation';
    import FlightList from './FlightList';
  
  
    const FlightListScreen = StackNavigator({
      FlightList: { screen: FlightList }
    });
  
  const ACCESS_TOKEN = 'access_token';
  
  export default class Login extends Component {
    constructor(props){
      super(props);
  
      this.state = {
        email: "",
        password: "",
        error: ""
      }
    }
  
  
  async storeToken(accessToken){
        try {
            await AsyncStorage.setItem(ACCESS_TOKEN, accessToken);
        } catch (error) {
            console.log("something went wrong");
        }
      }
  
    async onLoginPressed() {
      try {
        const reqOptions = {
          method: 'POST',
          headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
          },
          body: JSON.stringify({
  
              email: this.state.email,
              password: this.state.password,
  
          })
        };
  
        console.log("error of json is " + JSON.stringify(reqOptions))
        let response = await fetch('https://...login', reqOptions);
  
        if (response.status &gt;= 200 &amp;&amp; response.status &lt; 300) {
          const body = await response.json();
            this.storeToken(body.token);
            this.props.navigation.navigate('FlightListScreen');
        } else {
            //Handle error
            let error = res;
            throw error;
        }
      } catch(error) {
          this.setState({error: error});
          console.log("error " + error);
      }
    }
    render() {
  
      return (
        &lt;View style={styles.container}&gt;
        //view here
        &lt;/View&gt;
      );
    }
  }
  </code></pre>
  
  <p>FlightList.js</p>
  
  <pre><code>'use strict';
  import React, { Component } from 'react';
  import {
    StyleSheet,
    TextInput,
    TouchableHighlight,
    AsyncStorage,
    Text,
    View
  } from 'react-native';
  import {
      StackNavigator,
    } from 'react-navigation';
  
  const ACCESS_TOKEN = 'access_token';
  
  export default class FlightList extends Component {
    constructor(props){
      super(props);
    }
  
  
  async getToken() {
      try {
          let token = await AsyncStorage.getItem(ACCESS_TOKEN);
          console.log("token is" + token);
      } catch (error) {
          console.log("error while getting token");
      }
   }
  
   async getFlights() {
      try {
          const reqOptions = {
            method: 'GET',
            headers: {
              Authorization: `Bearer ${getToken()}`
            },
            body: JSON.stringify({
              // no body since it is GET call
  
            })
          };
  
          let response = await fetch('https://.../flights', reqOptions);
  
          if (response.status &gt;= 200 &amp;&amp; response.status &lt; 300) {
            const body = await response.json();
            //update the view
          } else {
              //Handle error
              let error = res;
              throw error;
          }
        } catch(error) {
            this.setState({error: error});
            console.log("error " + error);
        }
   }
  
  
  
   componentDidMount(){
      getFlights();
    }
  }
  </code></pre>
  
  <p>My questions is-</p>
  
  <p>1) In App.js how can  I check if token is there and if there show flight list screen else login screen</p>
  
  <p>2) Also the getToken() method how can I use it globally since I need it as header for all the API calls</p>