首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何在react native中使用没有选项卡栏的navigation.navigate导航到新页面

如何在react native中使用没有选项卡栏的navigation.navigate导航到新页面
EN

Stack Overflow用户
提问于 2018-06-01 05:56:09
回答 1查看 1.2K关注 0票数 0

我在其中一个选项卡中有一个选项卡导航和导航栏。我想导航到下一个屏幕。我在https://snack.expo.io/@react-navigation/stacks-in-tabs中试用了该教程,并在代码中添加了下面这一行:

static navigationOptions = ({navigate, navigation}) => ({
        title: "NOTIFICATION HISTORY",
        headerTitleStyle: {
          fontWeight: "bold",
          color: Colors.tintColor,
          alignSelf: "center"
        },
        headerStyle: {
          backgroundColor: "white",
          shadowOpacity: 0,
          shadowOffset: {
            height: 0
          },
          shadowRadius: 0,
          borderBottomWidth: 0,
          elevation: 0
        } 
    });



export const NotiStackNavigator = StackNavigator(
  {
    Noti: {
      screen: NotiScreen
    },
    NotiHistory: {
      screen: NotiHistScreen
    }
  },
  {
    navigationOptions: () => ({
      // gesturesEnabled: false,
      headerTitleStyle: {
        fontWeight: "bold",
        color: Colors.tintColor,
        alignSelf: "left"
      },
      headerStyle: {
        backgroundColor: "white",
        shadowOpacity: 0,
        shadowOffset: {
          height: 0
        },
        shadowRadius: 0,
        borderBottomWidth: 0,
        elevation: 0
      }
    })
  }

    export const MainTabNavigator = TabNavigator(
  {
    Home: {
      screen: HomeStackNavigator
    },
    Noti: {
      screen: NotiStackNavigator
    },
    Settings: {
      screen: SettingsScreen
    }
  },
  {
    navigationOptions: ({ navigation }) => ({
      // Set the tab bar icon
      tabBarIcon: ({ focused }) => {
        const { routeName } = navigation.state;
        let iconName;
        switch (routeName) {
          case "Home":
            iconName = "home";
            break;
          case "Noti":
            iconName = "bell-o";
            break;
          case "Settings":
            iconName = "cog";
        }
        return (
          <FontAwesome
            name={iconName}
            size={24}
            color={focused ? Colors.tabIconSelected : Colors.tabIconDefault}
          />
        );
      }
    }),
    // Put tab bar on bottom of screen on both platforms
    tabBarComponent: TabBarBottom,
    tabBarPosition: "bottom",
    // Disable animation so that iOS/Android have same behaviors
    animationEnabled: false,
    swipeEnabled: false,
    // Show the labels
    tabBarOptions: {
      showLabel: true,
      activeTintColor: Colors.tabIconSelected,
      inactiveTintColor: Colors.tabIconDefault,
      style: {
        backgroundColor: Colors.tabBar
      }
    }
  }
);

我可以把标签和导航栏打开。当导航转到下一个屏幕时,选项卡仍然在那里,选项卡的名称更改为新屏幕的名称。如何在进入下一个屏幕时去掉标签?

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50633355

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档