我正在使用 gorhom/react-native-bottom-sheet
我遇到的问题:
我在 BottomSheet
中有一个 FlatList
,我可以在 ios 上的 FlaLlist
中滚动,但它不适用于 android。
最佳答案
经过大量研究,我能够通过使用 BottomSheetFlatList
而不是同一包中的 FlatList
来解决问题。
import { BottomSheetFlatList } from "@gorhom/bottom-sheet";
<BottomSheetFlatList
ref={ref}
initialNumToRender={3}
keyExtractor={(item) => item?.id}
showsVerticalScrollIndicator={false}
maxToRenderPerBatch={3}
windowSize={7}
data={dat}
renderItem={renderItem}
/>
通过这样做,它也开始在 android 上正常工作。
但因为我也希望我的 Flatlist
在特定事件上使用 ref 自动滚动。
经过一些研究并且由于 @gorhom/bottom-sheet
的出色文档。我在文档的故障排除部分找到了解决方案。
但作为一名开发人员,StackOverflow
是我们解决每个问题的第一站。所以,我决定在这里发布答案。
回答
由于使用 TapGestureHandler 和 PanGestureHandler 包装内容和句柄,任何手势交互都不会按预期运行。
要解决此问题,请使用 react-native-gesture-handler 提供的 ScrollView 和 FlatList,而不是 react-native。
import {
ScrollView,
FlatList
} from 'react-native-gesture-handler';
在这里找到原始答案- https://gorhom.github.io/react-native-bottom-sheet/troubleshooting
关于react-native - FlatList 在 Android 上的 BottomSheet 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71108260/