PanGestureHandler 期望 `onGestureHandlerEvent` 监听器是一个函数

Question

使用PanGestureHandlerfrom react-native-gesture-handlerwith react-native-reanimatedwithuseAnimatedGestureHandler会引发此错误。

期望onGestureHandlerEvent侦听器是一个函数，而不是得到一个object类型的值

这些是正在渲染的组件，

<View style={[styles.center]}>
  <Text style={{color: "#555", fontSize:16, marginTop: 120, marginBottom: 70, width: 250, margin: 'auto'}}>Works on the web but throws an error on iOS.</Text>

  <Animated.View style={[styles.box, styles.center, animatedStyle]}>
    <PanGestureHandler onGestureEvent={gestureHandler}>
      <Text style={{color: "#444", fontWeight:'bold', padding: 16,}}>Drag me around</Text>
    </PanGestureHandler>
  </Animated.View>
</View>;

这里的小吃，https://snack.expo.dev/4Mp-PfXPU

Answer 1

GitHub 上的这条评论指出了正确的方向。

虽然文档中没有指定，但可以从示例中推断...PanGestureHandler需要内部有一个动画组件子组件<PanGestureHandler ...>。（例如<Animated.View ...>）

So<Animated.View ...>...</Animated.View>或其他一些动画组件需要位于 内部<PanGestureHandler onGestureEvent={gestureHandler}>。

<PanGestureHandler onGestureEvent={gestureHandler}>
  <Animated.View style={[styles.box, styles.center, animatedStyle]}>
      <Text style={{color: "#444", fontWeight:'bold', padding: 16,}}>Drag me around</Text>
  </Animated.View>
</PanGestureHandler>

这是一份工作零食，

https://snack.expo.dev/ZRr6t24Hv