首页 > 解决方案 > 连接 MaterialBottomTabNavigator 和其他不属于它的屏幕

问题描述

所以我正在研究 MaterialBottomTabNavigator,我遇到了这个小问题。我有4个屏幕。代码如下所示:

const bottomNavigator = createMaterialBottomTabNavigator(
    {
        home: {
            screen: HomeScreen,
            navigationOptions : {
                tabBarIcon: <Icon type="FontAwesome" name="home" style={{color:'#fff'}}  />, 
                title:'Home',
            }
        }


    trending: {
        screen: TrendingScreen,
        navigationOptions : {
            tabBarIcon: <Icon type="FontAwesome" name="fire" style={{color:'#fff'}}  />, 
            title:'Trending'
        }
    },
    profile: {
        screen: ProfileScreen,
        navigationOptions : {
            tabBarIcon: <Icon type="FontAwesome" name="id-badge" style={{color:'#fff'}}  />, 
            title:'Profile'
        }
    },

    settings: {
        screen:  SettingsScreen ,
        navigationOptions : {
            tabBarIcon: <Icon type="FontAwesome" name="cog" style={{color:'#fff'}}  />, 
            title:'Settings'
        }
    }
},

{
  initialRouteName: 'home',
  activeColor: '#f0edf6',
  inactiveColor: '#3e2465',
  barStyle: { backgroundColor: UI_COLORS['foxy'] },
}
  );

现在,我可以在这些屏幕之间发送信息了。HomeScreen、TrendingScreen、ProfileScreen,但我遇到的问题是当我必须打开另一个不是它的一部分的屏幕时。如何从这些屏幕中的任何一个导航到屏幕说“DiffScreen”。即假设我在 HomeScreen 中,并且我想转到不属于底部导航器的“DiffScreen”。任何帮助,我怎样才能到达那个屏幕?类似 this.props.navigation.navigate('DiffScreen') 或类似的东西我只是在这里感觉到一点redux需求,但如果我可以没有它会更好。

标签: javascriptreact-nativereact-navigationreact-navigation-stack

解决方案


推荐阅读