title: React-native - screen on iOS is not updated even if render method is called
body: <p>I am working on mobile app and I've run into problem which I don't know how to resolve.</p>
  
  <p>I have to load some data from API after creating a screen. I do this in <code>componentDidMount</code> method which is <code>async</code> so I can use <code>await</code> keyword. After that I am setting state so the Loader component (which is just modal displaying text) is hidden and the screen is rerendered with data from API. This works fine on Android devices. But running this code on iOS (iPhone X) doesn't work. The render methods of <code>SomeScreen.js</code> and <code>Loader.js</code> are called and <code>Loader.js</code> render method is returning null (checked with console) but the view on iPhone is not updated. Loader modal is still there even when its render method is returning null. Am I doing anything wrong? Calling <code>this.foceUpdate()</code> doesn't help either. </p>
  
  <p><code>SomeScreen.js</code></p>
  
  <pre><code>import React, {Component} from 'react';
  import Loader from 'components/Loader/Loader';
  
  export default class SomeScreen extends Component {
  
      constructor(props) {
          super(props);
          this.state = {
              loading: true,
              data: []
          };
      }
  
      async componentDidMount() {
          const data = await this.loadData();
          this.setState({loading: false, data: data})
      }
  
      async loadData() {
         //fetch and return data from API
      }
  
      render() {
          return (
              &lt;SafeAreaView style={{flex: 1}}&gt;
                  &lt;Loader loading={this.state.loading}/&gt;
                  //other rendering...
              &lt;/SafeAreaView&gt;
          );
      }
  }
  </code></pre>
  
  <p><code>Loader.js</code></p>
  
  <pre><code>import React, {Component} from 'react';
  import {Modal, Text, View} from 'react-native';
  
  export default class Loader extends Component {
      static defaultProps = {
          loading: false
      };
  
      render() {
          if (this.props.loading !== true) {
             return null;
          }
          return(
            &lt;Modal
                transparent={false}
                animationType={'none'}
                visible={true}&gt;
              &lt;View style={{backgroundColor: "white", flex: 1, justifyContent: "center"}}&gt;
                &lt;Text&gt;Loading data...&lt;/Text&gt;
              &lt;/View&gt;
            &lt;/Modal&gt;
          )
      }
  }
  
  </code></pre>