[解決済み] ScrollView 内の FlatList がスクロールしない

質問

私は、4 FlatList との maxHeight に設定します。 200 の中に ScrollView .

<ScrollView>
  <FlatList/>
  <FlatList/>
  <FlatList/>
  <FlatList/>
</ScrollView>

をスクロールしようとすると FlatList はスクロールしませんが ScrollView がスクロールします。どうすればこの問題を解決できますか？

ソースコード全文

import { Component, default as React } from 'react';
import { FlatList, ScrollView, Text } from 'react-native';

export  class LabScreen extends Component<{}> {
  render() {
    return (
      <ScrollView>
        {this.renderFlatList('red')}
        {this.renderFlatList('green')}
        {this.renderFlatList('purple')}
        {this.renderFlatList('pink')}
      </ScrollView>
    );
  }

  getRandomData = () => {
    return new Array(100).fill('').map((item, index) => {
      return { title: 'Title ' + (index + 1) };
    });
  };

  renderFlatList(color: string) {
    return (
      <FlatList
        data={this.getRandomData()}
        backgroundColor={color}
        maxHeight={200}
        marginBottom={50}
        keyExtractor={(item, index) => index.toString()}
        renderItem={({ item }) => <Text>{item.title}</Text>}
      />
    );
  }
}

スナック.エキスポリンク

解決方法は？

内蔵の nestedscrollenabled プロパティを使用します。

<FlatList nestedScrollEnabled />

これは Android でのみ必要です (iOS ではネストされたスクロールがデフォルトでサポートされています)。