title: How to load render giving a condition 'if' in React Native?
body: <p>I'm using a debug mode in Chrome browser and the simulator expo in my phone for iOS. In my App, I want to render but this render, depends of 'X' value. </p>
  
  <p>So I have window 1 and window 2 and I want that:</p>
  
  <ul>
  <li>if X is === null, then load window 1 and window 1 is going to window 2</li>
  <li>if X is!== null, then it loads directly into window 2 without passing window1.</li>
  </ul>
  
  <p><strong>This is my All Imports</strong></p>
  
  <pre><code>import React, {Component} from 'react';
  import {View, Text, Button, TextInput, Alert,ScrollView,AsyncStorage} from 
  'react-native';
  import axios from 'axios';
  </code></pre>
  
  <p><strong>My Css For my Component</strong></p>
  
  <pre><code>const myStyle = {
  principal: {
      paddingTop: 17,
      paddingLeft: 2,
      flex: 1,
      backgroundColor: 'black',
      justifyContent: 'center',
      alignItems: 'center',
  },
  caixa: {
      backgroundColor: 'white',
      height: 300,
      borderWidth: 1,
      width: 300,
      borderColor: 'black',
      alignItems: 'center',
      borderRadius: 20,
  },
  inputPin: {
      backgroundColor: 'white',
      width: 290,
      height: 40,
      borderRadius: 15,
      borderWidth: 1,
      borderColor: 'black',
      marginTop: 60,
      marginBottom: 30,
      alignItems: 'center',
      justifyContent: 'center',
      fontSize: 20,
      //paddingLeft:20,
      color: 'black',
      textAlign: 'center'
  },
  bemVindo: {
      fontSize: 40,
      marginBottom: 20,
  },
  botao: {
      alignItems: 'center',
  },
  texto: {
      textAlign: 'center',
      fontSize: 20,
      color: 'black',
      backgroundColor: 'white',
     }
    }
  </code></pre>
  
  <p><strong>I declareted my class with extends</strong></p>
  
  <pre><code>let mgm = '!!Ups, Inseriu O Pin Errado, Insira O Correcto';
  
  export default class PaginaInicial extends React.Component {
      constructor(props) {
          super(props);
          this.state = {isLoaded: true}
      }
      HttpRequest(){
      axios({
          method: 'post',
          url: 'https://api.feetit.com/shoestorebranch/auth?
   key=q59Sgv0sRr0i9Qh00aWM071hB76NZh9WcW4o3HPPpw847OT8T17Sq62n3O7FTT9n',
          data: {
              loginHash: this.state.codigoPin,
          }
      }
      ).then((response) =&gt; {
          //AsyncStorage.removeItem('localData', () =&gt; {});
          this.setState({dados: response.data.response})
          console.log('SUCCESS');
  
          if(this.state.dados.admin === null){
              Alert.alert('Loja sem Administrador atribuido, por favor 
            contacte o suporte.');
          }else{
  
              //console.log(this.state.dados);
              let tmp_localData = {};
              console.log("tmp_localData: ", tmp_localData);
              AsyncStorage.getItem('localData', (err, result) =&gt; {
                  tmp_localData = result;
  
              }).then( (result) =&gt; {
                      if(tmp_localData == null) {
                          tmp_localData = {
                              "ShoeStoreBranch": null,
                              "User": null
                          }
                      }
                      if (!tmp_localData.hasOwnProperty("ShoeStoreBranch")) {
                          tmp_localData.ShoeStoreBranch = {};
                      }
                      tmp_localData.ShoeStoreBranch = {
                          "shoeStoreBranchID": 
             this.state.dados.shoeStoreBranchID,
                          "name": this.state.dados.name,
                          "ShoeStore": {
                              "shoeStoreID": 
             this.state.dados.shoeStore.shoeStoreID,
                              "name": this.state.dados.shoeStore.name
                          }
                      };
                      tmp_localData.User = {
                          "userID": this.state.dados.admin.userID,
                          "displayName": this.state.dados.admin.displayName,
                          "email": this.state.dados.admin.email,
                          "avatar": this.state.dados.admin.avatar,
                          "gender": this.state.dados.admin.gender,
                          "Session": {
                              "token": this.state.dados.admin.token
                          },
                          "FootID": this.state.dados.admin.FootID
                      }
                      AsyncStorage.setItem('localData', 
             JSON.stringify(tmp_localData), () =&gt; {});
                      this.props.navigator.push({id: 'MenuPrincipal'})
              });
              //var tmp_dados = this.getState()
              //var qqer =this.state.dados.admin.token;
              //console.log(JSON.stringify(qqer));
          }
      }).catch((error) =&gt; {
              if (error.response) {
                  // The request was made and the server responded with a 
                   status code
                  // that falls out of the range of 2xx
                  console.log(error.response.data);
                  console.log(error.response.status);
                  console.log(error.response.headers);
                  if(error.response.status === 403){
                      console.log('App não tem autorização',error.message);
                      Alert.alert('App não tem autorização');
                  }else if(error.response.status === 404){
                      console.log('PIN inválido',error.message);
                      Alert.alert('PIN inválido');
                      AsyncStorage.getItem('localData', (err, result) =&gt; {
                          console.log(result);
                      });
                  }else if(error.response.status &gt;=400 &amp;&amp; 
         error.response.status &lt;500){
                      console.log('Erro, por favor contactar o 
         suporte',error.message);
                      Alert.alert('Erro, por favor contactar o suporte');
                  }else{
                      console.log('Erro interno, por favor contactar o suporte',error.message);
                      Alert.alert('Erro interno, por favor contactar o suporte');
                  }
              } else if (error.request) {
                  // The request was made but no response was received
                  // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
                  // http.ClientRequest in node.js
                  console.log('erro de ligaçao',error.message);
                  Alert.alert('erro de ligaçao');
                  console.log(error.request);
              } else {
                  // Something happened in setting up the request that triggered an Error
                  console.log('erro de codigo no then',error.message);
                  Alert.alert('App error');
              }
              console.log(error.config);
              //console.log('Erro ao imprimir ao enviar os dados')
          });
  }
  
  componentDidMount() {
      AsyncStorage.getItem('localData').then((result) =&gt; {
          this.setState({
              isLoading: false
          });
      });
  }
  </code></pre>
  
  <p><strong>The funtion that i am using is something like this:</strong></p>
  
  <pre><code>render(){
      if (this.state.isLoading) {
          if(result.hasOwnProperty("User") &amp;&amp; result.User.hasOwnProperty("Session") &amp;&amp; result.User.Session.hasOwnProperty("token") &amp;&amp; (result.User.Session.token).length &gt; 0) {
              console.log('USER JA LOGADO? -&gt; SIM');
              return
  </code></pre>
  
  <p><strong>My scene than i want to change if state.isloading is false</strong></p>
  
  <pre><code>            {this.props.navigator.push({id: 'MenuPrincipal'})};
  
          }
      }
  </code></pre>
  
  <p><strong>here is the when state.isLoading is true</strong></p>
  
  <pre><code>        const {principal, caixa, inputPin, bemVindo, botao, texto} = myStyle;
          return (
              &lt;View style={principal}&gt;
                  &lt;View style={caixa}&gt;
                      &lt;Text style={bemVindo}&gt;Bem Vindo&lt;/Text&gt;
                      &lt;Text style={texto}&gt;Para que possamos identificar-lhe, Indique a baixo o código pin&lt;/Text&gt;
                      &lt;TextInput placeholder='Código da Loja' style={inputPin}
                                 onChangeText={(textoInput) =&gt; this.setState({codigoPin: textoInput})}
                      /&gt;
                      &lt;Button title='Continuar'style={botao} onPress={() =&gt; {
                          this.HttpRequest();
                      }}
                      /&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
          );
      }
  }
  </code></pre>