title: Trouble rendering dynamically in react native
body: <p>I have this function in my react native class:</p>
  
  <p>the Content of Before Button Press shows immediately when the component mounts, but when i press the hello text,the "onPressingTheButton" function is executed and the console shows the logged text and 
  the flag is now 2.
  the problem is that the "Content After Button Press" is not displayed even after changing the flag.</p>
  
  <pre><code>PastEvents = () =&gt; {
      var hello;
      var flag = 1
  
  function onPressingTheButton() {
    console.log("logged text")
    flag = 2
    console.log(flag) //2
  }
  if (flag == 1) {
    hello = &lt;View&gt;Content Before button Press&lt;/View&gt; //displayed
  }
  
  if (flag == 2) {
     hello = &lt;View&gt;After Button Press&lt;/View&gt; //never displayed
  }
    return (
      &lt;View style={styles.container}&gt;
        {hello}
        &lt;TouchableOpacity&gt;
          &lt;Text onPress={() =&gt; onPressingTheButton()}&gt;helloo&lt;/Text&gt;
        &lt;/TouchableOpacity&gt;
      &lt;/View&gt;
    )
   }
  }
  </code></pre>
  
  <p>as a note, the past event function is called by a scenemap from the first render
  :</p>
  
  <pre><code> render() {
        return (
          &lt;TabView
            navigationState={{ index: this.state.index, routes: this.state.routes }}
            renderScene={SceneMap({
              PastEvents: this.PastEvents,
              UpcomingEvents: this.UpcomingEvents,
            })}
          /&gt;
        );
      }
  </code></pre>
  
  <p>how can I display the "Content After button Press"?
  Thank you for your help.</p>