微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何防止PanGestureHandler处理嵌套TextInput中的手势与react-navigation一起使用

如何解决如何防止PanGestureHandler处理嵌套TextInput中的手势与react-navigation一起使用

目前,我有一个注释列表和一个用于在堆栈导航屏幕中输入新注释的字段

<Stack.Screen
  name="MySwipeableScreen"
  options={{
    gestureEnabled: true,}}
>
  {
    <View>
      <FlatList
       data={comments}
      />
      {/* Stop responding to swipe ! */}
      <TextInput />
    </View>
  }
</Stack.Screen>;

借助手势启用,react-navigation在后台使用react-native-gesture-handler的PanGestureHandler组件。即使我尝试在TextInput内滑动,此组件也会响应所有手势以向右滑动以触发“返回”操作。

我想到了2个解决方案,但无法最终确定它们:

  • 仅在我希望它响应的部分屏幕上使用我自己的PanGestureHandler。但是然后,我将不得不在自己的代码中将所有的反应导航配置道具重写为该PanGestureHandler。

  • 对于手势重叠的情况,
  • react-native-gesture-handler有一个有趣的道具waitFor = {ref}。该库甚至将引用导出到此PanGestureHandler。但是这种情况没有用。因为应该逆转。我应该将引用从嵌套处理程序传递给父处理程序。

有人知道如何解决此案吗?

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。