仅在 FlatList 顶部时向下滑动模态

Posted 2023-02-19

【中文标题】仅在 FlatList 顶部时向下滑动模态

【英文标题】：Swipe down modal only when at the top of FlatList

【发布时间】：2021-06-05 10:13:31

【问题描述】：

我正在尝试克隆 TikTok cmets 模态（参见下面的 gif），用户应该能够向下滚动以查看更多 cmets，一旦他们向上滚动并到达顶部，它们的模态将被拉下。

在我的代码中，我用 PanGestureHandler 封装了 FlatList。目前，一旦用户到达 cmets 顶部并尝试向下滑动，模态不会移动。

【参考方案1】：

你可以使用https://github.com/gorhom/react-native-bottom-sheet，这个仓库提供了一个BottomSheetFlatList，这正是你所需要的

【参考方案2】：

您可以检查滚动值，并根据该值应用向下滚动条件。在 FlatList 中使用它并相应地设置状态。 希望对你有很大帮助

 onMomentumScrollEnd=(event) =>  
      if(event.nativeEvent.contentOffset.y > 105)
        setselectedbutton(2)
      else if(event.nativeEvent.contentOffset.y < 105)
        setselectedbutton(1)