title: How to render a partial view on another view in react native
body: <p>When I tried alert("Hi") in <code>renderMoreView</code> function, it actually works, but to display the View is the problem I am facing</p>
  
  <pre><code>export default class Home extends Component {
    state = {
      moreButton: false,
    };
  
    renderMoreView = () =&gt; {
      return (
        &lt;View style={{flex: 1, height: 50, width: 50}}&gt;
          &lt;Text&gt;Hi&lt;/Text&gt;
        &lt;/View&gt;
      );
    };
  
    render () {
      return (
        &lt;View&gt;
          .....
          &lt;TouchableOpacity
            underlayColor="transparent"
            onPress={() =&gt; this.setState ({moreButton: true})}
          &gt;
            &lt;Feather name="more-vertical" size={25} /&gt;
          &lt;/TouchableOpacity&gt;
  
          ...
          {this.state.moreButton ? this.renderMoreView () : null}
        &lt;/View&gt;
      );
    }
  }
  
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/u7HOa.jpg" rel="nofollow noreferrer">This is what I am trying to do</a>]</p>