从嵌套的 TabNavigator 返回到根导航器答案

【问题标题】：Go back to root navigator from a nested TabNavigator从嵌套的 TabNavigator 返回到根导航器
【发布时间】：2018-05-05 04:22:40
【问题描述】：

这就是我的层次结构的样子，

-StackNavigator (root)
    -Portada
    -MainScreen (TabNavigator)
        -Home
        -Cronograma
        -Perfil
    -Login
    -Register

我导航到 Portada -> 主屏幕 -> Perfil，现在我想再次从 Perfil 回到 Portada，我该怎么办？

【问题讨论】：

你试过navigate吗？

标签： react-native react-navigation

【解决方案1】：

你可以简单地使用

this.props.navigation.navigate(“Portada”)

它会起作用的！

【讨论】：

【解决方案2】：

考虑到您在导航声明中定义了Portada 路由，您可以使用this.props.navigation.navigate('Portada') 从任何子组件导航。

navigation props 默认通过 props 传递给父组件的所有子组件。

有关更多详细信息，请参阅文档：https://reactnavigation.org/docs/navigation-prop.html

【讨论】：

【解决方案3】：

重置堆栈导航器：

 this.props.navigation.dispatch(NavigationActions.reset({
    index: 0,
    actions: [
    NavigationActions.navigate({ routeName: 'Portada'})
   ]
 });

this.props.navigation.navigate('Portada');

【讨论】：

如果我使用 this.props.navigation.goBack();，它会将我带到 HomeTab，但我使用你的代码它根本不起作用，我在同一个屏幕上。
然后尝试重置堆栈导航器。
我也试过了，但没有成功，你在你的项目中使用过还是有例子
如果您使用我上面的代码出现黑屏，请尝试我的更新代码。
不容易，我觉得这里讨论的比较多->github.com/react-navigation/react-navigation/issues/335

【解决方案4】：

使用screenProps 传递父导航。

例子：

<TabbarRoot screenProps = {{ navi : this.props.naviagtion }}>

在标签栏中的屏幕中：

this.props.screenProps.navi.popToTop()

这将导航回 Root Navigator。

【讨论】：