FlatList inside ScrollView doesn't work in React Native

Question

When I'm using FlatList inside ScrollView I'm getting an error as VirtualizedLists should never be nested inside plain ScrollViews with the same orientation - use another VirtualizedList-backed container instead.

I have tried to add the Components as mentioned below:

<SafeAreaView>
  <ScrollView>
    <View>
      <FlatList />
    </View>
  </ScrollView>
</SafeAreaView>                    

Answer 1

Use this way instead of using Flatlist inside Scrollview like

<SafeAreaView style={{flex: 1}}>
    <FlatList
      data={data}
      ListHeaderComponent={ContentThatGoesAboveTheFlatList}
      ListFooterComponent={ContentThatGoesBelowTheFlatList} />
</SafeAreaView>