反应导航：回到堆栈顶部但禁用“返回”答案

【问题标题】：React Navigation : back to top of stack but disable "BACK"反应导航：回到堆栈顶部但禁用“返回”
【发布时间】：2018-05-09 15:06:24
【问题描述】：

我正在为 Android 应用程序和 React Navigation 使用 React Native。现在在屏幕 0 (S0)。然后做了以下导航。

this.props.navigation.navigate("S1")
this.props.navigation.navigate("A1")
this.props.navigation.navigate("A2")
this.props.navigation.navigate("A3")

现在，一旦 A3 中的操作完成，我必须导航回屏幕 1 (S1)。但是，如果我使用this.props.navigation.navigate("S1")，发生的情况是我可以按返回按钮（硬件或标题栏）并返回屏幕A3。

当按下S1 上的后退按钮时，我想回到S0。我也不想手动设置，因为很多其他页面可以到S1。

任何建议或想法如何使这项工作？我试过popToTop() 和goBack("A")，但都没有工作。

【问题讨论】：

我不能详细回答你，因为我马上要离开办公室了。但是我通过使用两个不同的导航器实现了相同的处理。如果这不起作用，您可以尝试手动更改导航器堆栈。这个堆栈应该可以通过 this.props.navigation 访问 - 顺便请插入您正在使用的导航器，因为那里有几个。

标签： reactjs react-native navigation react-navigation

【解决方案1】：

您可以使用NavigationActions.reset 回到您的第一个屏幕，或使用NavigationActions.pop“弹出”回到您想要的屏幕。

导航重置示例代码：

    this.props.navigation.dispatch(NavigationActions.reset({
            index: 0,
            actions: [
                    NavigationActions.navigate({ routeName: 'S0' }),
                    NavigationActions.navigate({ routeName: 'S1' }),
                    NavigationActions.navigate({ routeName: 'A1' }),
                    NavigationActions.navigate({ routeName: 'A2' }),
                    NavigationActions.navigate({ routeName: 'A3' }),
            ],
    }));

导航弹出示例代码：

    this.props.navigation.dispatch(NavigationActions.pop({
            n: 3,
            immediate: true
    }));

注意：记得导入 { NavigationActions }

【讨论】：

【解决方案2】：

我成功地完成了这项工作

this.props.navigation.pop(4)。它只会返回到前 4 页，并且“返回”按钮仍然可以按我的预期工作。 @Bryan 的建议在其中一种情况下对我有用，但我需要一个更通用的解决方案：D

感谢各位帮忙！真的很感激。

【讨论】：