title: FlatList inside ScrollView doesn't scroll
body: <p>I've 4 <code>FlatList</code>s with <code>maxHeight</code> set to <code>200</code> inside a <code>ScrollView</code>. </p>
  
  <pre><code>&lt;ScrollView&gt;
    &lt;FlatList/&gt;
    &lt;FlatList/&gt;
    &lt;FlatList/&gt;
    &lt;FlatList/&gt;
  &lt;/ScrollView&gt;
  </code></pre>
  
  <p>and when I try to scroll a <code>FlatList</code>, it doesn't scroll but the <code>ScrollView</code> scrolls. How do I fix this issue ?</p>
  
  <p><strong>Full Source Code</strong></p>
  
  <pre><code>import { Component, default as React } from 'react';
  import { FlatList, ScrollView, Text } from 'react-native';
  
  export  class LabScreen extends Component&lt;{}&gt; {
    render() {
      return (
        &lt;ScrollView&gt;
          {this.renderFlatList('red')}
          {this.renderFlatList('green')}
          {this.renderFlatList('purple')}
          {this.renderFlatList('pink')}
        &lt;/ScrollView&gt;
      );
    }
  
    getRandomData = () =&gt; {
      return new Array(100).fill('').map((item, index) =&gt; {
        return { title: 'Title ' + (index + 1) };
      });
    };
  
    renderFlatList(color: string) {
      return (
        &lt;FlatList
          data={this.getRandomData()}
          backgroundColor={color}
          maxHeight={200}
          marginBottom={50}
          keyExtractor={(item, index) =&gt; index.toString()}
          renderItem={({ item }) =&gt; &lt;Text&gt;{item.title}&lt;/Text&gt;}
        /&gt;
      );
    }
  }
  </code></pre>
  
  <p><a href="https://snack.expo.io/HyqtjuQz7" rel="noreferrer">snack.expo link</a></p>