title: How to re-render parent component on change on sub component in react native?
body: <p>I have a component that renders another component. When i make a change on the sub component, I would like the main component to re render.</p>
  
  <p>In the example below <code>onSubmit</code> from the second component, triggers <code>_onSubmit</code> on the main component, but <code>setState</code> doesn't re-render the view</p>
  
  <p>Ideas?</p>
  
  <pre><code>class MainLayout extends Component {
    constructor(props) {
      super(props);
  
      this.state = {
        data: 'no',
      };
  
      this._onSubmit = this._onSubmit.bind(this);
    }
  
    // this get's triggered by _checkSubmitReady() on the second component
    _onSubmit(data) {
      // this state get's set, but this component is not re-rendered
      // i assume render() should be called here
      this.setState({data: data});
    }
  
    render() {
      return (
        &lt;View&gt;&lt;SecondLayout onSubmit={this._onSubmit}/&gt;{this.state.data}&lt;/View&gt;
      );
    }
  }
  
  
  class SecondLayout extends Component {
    constructor(props) {
      super(props);
  
      this._checkSubmit = this._checkSubmit.bind(this);
    }
  
    _checkSubmit() {
      this.props.onSubmit('yes');
    }
  
    // sub component is mounted, call onSubmit() on parent component
    componentDidMount() {
      this._checkSubmit();
    }
  
    render() {
      return (
        &lt;View&gt;&lt;Text&gt;Nothing here&lt;/Text&gt;&lt;/View&gt;
      );
    }
  }
  </code></pre>