如何保持我的组件（<MainImage>）和 Flatlist 组件可滚动？反应原生答案

【问题标题】：How to maintain my component(<MainImage>) and Flatlist component scrollable? React Native如何保持我的组件（<MainImage>）和 Flatlist 组件可滚动？反应原生
【发布时间】：2018-07-26 22:30:27
【问题描述】：

我在一个平面列表上方有这个特殊的组件，它呈现我的卡片，我想让它们都可以滚动。我试图用 ScrollView 嵌套它们：

<ScrollView>
    <MainImage/>

    <FlatList />
 </ScrollView>

它可以工作，但我的平面列表失去了限制内存的能力，因为我有很多数据可以渲染应用程序直到崩溃。

如果从我的 MainImage 组件中删除 ScrollView，它会卡在屏幕上，并且卡片会在它后面滚动，这并不酷。

<View>
   <MainImage/>

   <FlatList/>
</View>

如何让两个组件都能够滚动而不损失性能？ obs：我使用的是 0.55 版的 react native

【问题讨论】：

你应该使用ScrollView，那么只有你可以滚动整个内容。分享代码以了解您如何使用 Flatlist。 Flatlist 旨在处理大量数据

标签： react-native scrollview react-native-flatlist

【解决方案1】：

您还可以在平面列表上方使用可折叠导航栏，而不是使用单独的 MainImage 组件。人们正在这样做，此链接中给出了示例 (https://medium.com/appandflow/react-native-collapsible-navbar-e51a049b560a)

【讨论】：

谢谢，但我在使用动画平面列表时遇到了一些问题。我只是使用ListHeaderComponent 解决了这个问题