Question

我有一个React Native应用程序，它有一个堆栈导航器和一个底部选项卡导航器。底部标签导航器和堆栈导航器之间具有共同的屏幕。结构如下：

const ExploreNavigator = createStackNavigator({
    Explore: {
        screen: ExploreScreen
    },
    Read: {
        screen: ReadScreen
    },
    CreateImage: {
        screen: CreateImageScreen
    }
})




const TabsNavigator = createBottomTabNavigator({
    ExploreTab: {
        screen: ExploreNavigator,
        navigationOptions: {
            tabBarLabel: "Explore"
        }
    },
    ReadTab: {
        screen: ReadScreen,
        navigationOptions: {
            tabBarLabel: "Read"
        }
    }
})

现在，如果我直接从“底部”选项卡导航器移至“阅读”屏幕并移至堆栈导航器的CreateImage屏幕，则当我按“后退”按钮时，我将返回到默认屏幕，即“浏览”屏幕？ < / p>

那么，解决此问题的最佳方法是什么？我知道我可以创建另一个堆栈导航器并添加相关的屏幕。另外，如果采用这种方法，我可以将堆栈导航器屏幕命名为相同的名称吗？

Answer 1

我认为不需要在大胆的堆栈和底部标签中保留一个屏幕。所以我建议像这样

const ExploreNavigator = createStackNavigator({
    Tabs: {
        screen: TabsNavigator
    },
    CreateImage: {
        screen: CreateImageScreen
    }
})




const TabsNavigator = createBottomTabNavigator({
    Explore: {
        screen: ExploreScreen,
        navigationOptions: {
            tabBarLabel: "Explore"
        }
    },
    ReadTab: {
        screen: ReadScreen,
        navigationOptions: {
            tabBarLabel: "Read"
        }
    }
})

Answer 2

我会这样做

    const ExploreNavigator = createStackNavigator({
    ExplorePrimary: {
        screen: ExploreScreen
    },
    ReadPrimary: {
        screen: ReadScreen
    },
    CreateImagePrimary: {
        screen: CreateImageScreen
    }
  })

  const ReadNavigator = createStackNavigator({
    ExplorePrimary: {
        screen: ExploreScreen
    },
    ReadSecond: {
        screen: ReadScreen
    },
    CreateImageSecond: {
        screen: CreateImageScreen
    }
  })




  const TabsNavigator = createBottomTabNavigator({
    ExploreTab: {
        screen: ExploreNavigator,
        navigationOptions: {
            tabBarLabel: "Explore"
        }
    },
    ReadTab: {
        screen: ReadNavigator,
        navigationOptions: {
            tabBarLabel: "Read"
        }
    }
  })

在反应导航中管理多个导航器（堆栈导航器和bottomtabs导航器）

2 个答案: