时间戳

首页 > 解决方案 > 如何在不中断 onEndReached 的情况下在 ScrollView 中有一个 React FlatList

reactjs - 如何在不中断 onEndReached 的情况下在 ScrollView 中有一个 React FlatList

问题描述

我使用 FlatList 做了一个无限滚动，它自己完美地工作。当我将它添加到底部抽屉（基于此）时，“onEndReached”开始变得疯狂 - 它会突然达到 10 倍，然后滚动到列表末尾将不再触发它。在我看来，手势处理程序或 Animated.ScrollView 正在破坏平面列表的滚动。我可以以某种方式保留底部抽屉吗？

更新：使用这个底部抽屉解决了这个问题，但是我们失去了向上/向下拖动抽屉以打开/关闭的能力，它需要一个按钮。这显然是 ScrollView 和 FlatList 的问题。我很想知道这是如何/为什么起作用的，而不仅仅是“我换了另一个似乎起作用的部分。不知道为什么……但它起作用”的创可贴解决方案

标签： reactjsreact-native

解决方案

您可以设置 Scrollview 道具style和contentContainerStyle. 这将防止 onEndReached 无限触发。

例如：

<ScrollView
    style={{ flex: 1 }}
    contentContainerStyle={{ flex: 1 }}
>
    <Flatlist
     ....
     />
</ScrollView>

有关此问题的讨论，请参阅此 github 问题。

推荐阅读