React Navigation 理解导航器嵌套

Posted 2023-04-13

【中文标题】React Navigation 理解导航器嵌套

【英文标题】：React Navigation understanding navigator nestings

【发布时间】：2018-07-31 00:20:26

【问题描述】：

我用了react-navigation快半年了，但是还是不明白其中的嵌套部分。导航道具如何继承，如何通信等。

我从 redux 示例应用创建了一个关于零食的演示。

Demo

我想了解这些：

如果我导航到子导航器，导航道具会发生什么情况？

如何从子导航器屏幕导航到父母屏幕或父母其他孩子的屏幕

如何从状态中移除子导航器？

最简单的例子： 在登录事件中，我使用 Main StackNavigator 重置了导航器。 问题在于，我必须手动重建整个 Main 状态。 如果我能以某种方式删除 Auth StackNavigator 并保留主堆栈，那就容易多了。

是否可以通过子导航器的导航操作触发 redux 事件？

如文档所述，我用 redux 组件包装了主导航 (StackNavigator) 组件。在我导航到子组件之前它工作正常。导航道具 niavigate 方法停止调度 redux 操作。

这个，我无法在演示中重新创建

我在 StackNavigator 中有一个组件和一个 DrawerNavigator。 如果我从组件导航到 DrawerNavigator（那里只有 1 个屏幕），我将无法返回到该组件：

this.props.navigation.goBack()

奇怪的是，它在屏幕组件内部是唯一不可能的。从屏幕的标题组件中它的工作。

【参考方案1】：

始终可以在props.navigation访问。

需要reset 操作才能导航到父/子导航器。 另外，由于#1127 key: null 是必需的

navigation.replace 是登录导航到主屏幕的另一个选项，如果屏幕在同一个导航器中，如果需要动画转换，请使用 reset。或者查看#295中的其他方法

navigate只能在同一个导航器中导航到屏幕，其他方法参考答案3。

可能缺少组件navigationprops

Working Demo

【讨论】：

1.我知道它可以从道具访问导航对象。我想知道，如果进入子导航器，这个 props.navigation 对象会被子导航器自己的导航对象替换还是发生其他事情？ 2. 如果我在子导航器中，那么要导航（或重置）到同级导航器，我必须有父导航对象（例如在 screenProps 中），对吗？ 5. 它有一个导航道具，但只包含 DrawerNavigator 的屏幕。我检查了你的演示，当它重置为 MainDrawer 时，状态中缺少 Profile 路由。

@Xyzor 1. 它是同一个对象。 2.重置意味着重建状态，您可以使用带有多个导航操作的重置并更改index参数。 5.如果您需要在抽屉中放置个人资料，您需要在里面输入MainDrawerNavigator。

感谢您的帮助。我能够解决导航问题。我的问题是我无法使用导航方法在嵌套导航器之间导航。所以我在 screenProps 中传递了根导航参数，并使用这个根导航发送了重置操作。没有传给孙子。这就是为什么它只在根导航的孩子中起作用的原因。尽管发生了一件奇怪的事情。如果导航越来越深，导航后会调度越来越多的“Navigation/COMPLETE_TRANSITION”动作。这正常吗？

我觉得不正常，能不能把零食更新到你现在的状态？