Android 是否支持 React Native 的 onScroll、onScrollEndDrag、onScrollBeginDrag?

IT技术 android reactjs react-native android-emulator expo
2021-05-12 20:07:22

console.logonScrollBeginDrag, 中有一些简单的语句onScrollonScrollEndDrag并附在ScrollView. 我可以看到它们在我的 iOS 设备上按预期工作,但它们不能在 Android 模拟器上工作。

这就提出了一个问题,这些props是仅在 iOS 上支持还是在 Android 模拟器上有问题?

代码很简单:

onScroll={() => console.log("scroll")}
onScrollBeginDrag={() => console.log("begin")}
onScrollEndDrag={() => console.log("end")}
2个回答

是的,他们受到支持,但他们有问题......

我假设您使用 a<FlatList />来渲染您的组件,对吗?

如果是这样,您的问题很可能是由于<View />包含您的<FlatList />项目被 Android 优化掉了Android 会自动删除实际上不呈现任何内容(例如背景颜色或边框)的“包装”视图。这种优化有助于减少视图层次结构的深度,但在某些情况下(例如这种)可能会导致意外结果......

为项目backgroundColor的包装添加了透明<View />,现在onScrollBeginDrag,onScrollEndDragonScroll事件<FlatList />按预期触发!

<FlatList
  onScrollBeginDrag={() => console.log('begin')}
  onScrollEndDrag={() => console.log('end')}
  onScroll={() => console.log('end')}
  data={[{key: 'a'}, {key: 'b'}]}

  renderItem={({ item }) => (
    <View style={{ backgroundColor: 'transparent' }}>
      <Text>{item.key}</Text>
    </View>
  )}
/>

我还删除了 FlatList 填充,并在环绕视图中添加了一些填充,这使得可触摸区域更大。

PS:向Bartol Karuza 致敬

onScrollBeginDrag在 FlatList 中使用react-native 0.59.9,而且正如你所说,它不适用于 android 模拟器(在 genymotion、android 7 上测试)。

但是,它确实可以在运行 android 8 的智能手机上使用,因此有一种方法可以使用它...