无法在本机反应中正确地在两个不同的堆栈之间导航并保持功能正常

时间:2018-11-08 19:06:57

标签: react-native react-navigation

当前,这是我的本机应用程序中的屏幕。

Unit

我试图从页面Root Nav - (SwitchNavigator) Stack A - (BottomTabNavigator) Page A Page B Stack B - (StackNavigator) Page C Page D 导航到页面C/D,但是当我尝试使用A/B导航时,它将正确导航,但是历史记录功能(例如向右滑动或调用{ {1}}转到上一页(在不同的堆栈中)不起作用。 导航到页面this.props.navigation.navigate()并向右滑动时,它会转到页面goBack()并再次向右滑动不会执行任何操作。

1 个答案:

答案 0 :(得分:1)

不同的堆栈应独立放置,因此,如果需要在这些屏幕之间保留导航历史记录,则必须将它们设置在同一堆栈中。可以像在屏幕上一样在流程中设置堆栈,例如,在抽屉式导航器中设置堆栈导航器:

/**
 * User drawer stack
 */
const DrawerStack = DrawerNavigator({
    Home: {screen: HomeStack}, //HomeStack is a StackNavigator
}, {
    contentComponent: DrawerContainer,
    initialRouteName: 'Home',
});

重新思考您想要的历史记录。如果我正确理解了您的用例,那么您希望A / B与C / D共享历史记录,那么您就需要像这样:

Root Nav - (SwitchNavigator)
    Stack B - (StackNavigator)
        Stack A - (BottomTabNavigator)
            Page A
            Page B
        Page C
        Page D

如果由于某种原因而不能执行此操作,则需要捕获后按和手动滑动,以自行执行操作。