reactjs - React Native 禁用 TabNavigator 中滑动 StackNavigator

Question

我有 TabNavigator，屏幕为 1 和 2，内部屏幕 1 我有 StackNavigator，屏幕为 1.1 和 1.2。我已启用滑动和手势。从 root 开始，我可以在 1 和 2 之间滑动选项卡。当我在屏幕 1 上并打开屏幕 1.1 时，我仍然可以滑动到屏幕 2，并且当 1.1 屏幕打开时，我需要以某种方式禁用此功能。

我需要它像 Instagram 应用程序 (ios) 一样工作。当您位于主屏幕 (1) 时，您可以向左滑动以查看直接屏幕 (2)。当您从主屏幕 (1) 打开 friend 个人资料时，它将作为屏幕 (1.1) 打开，并且您无法向左滑动以打开直接屏幕 (2)。你只能回去。

我的这个功能运行得很好，但是有了这个“bug”，我可以从屏幕 1.1 导航到屏幕 2。

我尝试通过阅读文档和其他人的导航问题以不同的方式解决这个问题，但不知何故并没有真正按照我的需要工作。我想我的嵌套屏幕结构或其他东西出了问题，或者以不同的方式解决了。

有人知道吗？

Answer 1

选项卡中的每个屏幕都可以单独设置导航选项swipeEnabled。

看看Tab Navigator Screen Navigation Options文档。

MyScreen.navigationOptions = ({navigation}) => ({
  swipeEnabled: false
});

您可以将该值设置为检查堆栈导航器是否已导航到的函数的结果。

更新 - react 导航 3

此属性已删除，并替换为 gesturesEnabled。
您可以单独设置每个屏幕的值，或在导航器配置级别设置默认值。

const navigator = createStackNavigator(
  {
    Main: { screen: Main },
    ...
  },
  {
    defaultNavigationOptions: {
      gesturesEnabled: false,
    },
    ...
  }
);