Question

我这里有一个嵌套的PageWithStackNavigator，在React Navigation示例的这段代码中，用于自定义选项卡视图：

const CustomTabView = ({ descriptors, navigation }) => {
  const { routes, index } = navigation.state;
  const descriptor = descriptors[routes[index].key];
  const ActiveScreen = descriptor.getComponent();

  return (
    <SafeAreaView>
      <CustomTabBar navigation={navigation} />
      <ActiveScreen navigation={descriptor.navigation} />
    </SafeAreaView>
  );;
};


const CustomTabRouter = TabRouter(
  {
    PageWithStackNavigator,
    PageTwo,
  },
  {
    initialRouteName: 'PageWithStackNavigator',
  }
);

const navigator = createNavigator(CustomTabView, CustomTabRouter, {})
const CustomTabs = createNavigationContainer(navigator);

但是，这导致了多个路由器。这里看到的CustomTabRouter，以及PageWithStackNavigator中的一个路由器。根据我是否在选项卡中或在PageWithStackNavigator中调用它，“ this.props.navigation.goBack（）”正在执行不同的操作。

对于每个the docs，我应该做类似“静态路由器= AuthenticationNavigator.router;”的事情，但是我看不到如何使用自定义TabRouter来做到这一点。

Answer 1

问题不在于有多个路由器，而是在goBack命令中。

来自我的github问题上的comment：

我知道这很令人困惑，但是您需要使用goBack（null）。 goBack（）帮助程序会自动提供您要返回的密钥，然后将其限制在其内部的堆栈中。 goBack（null）表示可以从任何地方返回。

自定义导航器中的嵌套导航器？导致多个路由器

1 个答案: