React native 如何使用;createStackNavigator“;及;createMaterialTopTabNavigator“;在一起

React native 如何使用;createStackNavigator“;及;createMaterialTopTabNavigator“;在一起,react-native,navigation,react-native-tabnavigator,React Native,Navigation,React Native Tabnavigator,在我的react本机应用程序中,我使用的是“createStackNavigator”,但当我结合使用“createMaterialTopTabNavigator”时,会出现错误。如何使用这两种导航?我尝试了aolot,但未能解决此问题。在我的代码中,我使用createStackNavigator两次,一次用于home,另一次用于tabScreen,当我单独使用时,两者都可以很好地工作,但不能组合使用 Main.js const Home = createStackNavigator(

在我的react本机应用程序中,我使用的是“createStackNavigator”,但当我结合使用“createMaterialTopTabNavigator”时,会出现错误。如何使用这两种导航?我尝试了aolot,但未能解决此问题。在我的代码中,我使用createStackNavigator两次,一次用于home,另一次用于tabScreen,当我单独使用时,两者都可以很好地工作,但不能组合使用

Main.js

const Home = createStackNavigator(
    { 
        Profile: Profile,
        Feed: Feed,
        Chemein: Chemein,
        Graph: Graph,
    },
      {
          initialRouteName: 'Profile',

            defaultNavigationOptions: { 
            headerStyle: {
                backgroundColor: '#744DD2',
            },
            headerTintColor: '#fff',
            headerTitleStyle: {
                fontWeight: 'bold',
            },
        },
    },

);

const TabScreen = createMaterialTopTabNavigator(
    {
        Clubs: { screen: Clubs },
        Members: { screen: Members },
    },
    {
        tabBarPosition: 'top',
        swipeEnabled: true,
        tabBarOptions: {
            activeTintColor: '#ffff',
            inactiveTintColor: '#ccc',
            style: {
                backgroundColor: '#744DD2',
            },
        },
    }
);

const TopTab = createStackNavigator({
    TabScreen: {
        screen: TabScreen,
        navigationOptions: {
            headerStyle: {
                backgroundColor: '#744DD2',
            },
            headerTintColor: '#FFFFFF',
            title: 'Clubs',
        },
    },
});

 const container = createAppContainer(Home);
// const container = createAppContainer(TabScreen );

 export default container;

我做过这样的事:

const TabNavigator = createBottomTabNavigator(
  {
    Home: AppStack,
    Notification: Notifications,
    Account: SettingsScreen,
  },
  {
    defaultNavigationOptions: ({navigation}) => ({
      tabBarIcon: ({focused, tintColor}) =>
        getTabBarIcon(navigation, focused, tintColor),
    }),
    tabBarOptions: {
      activeTintColor: colors.tealC,
      inactiveTintColor: 'gray',
    },
  },
);
my
appstack
是我的堆栈导航器,代码如下:

const AppStack = createStackNavigator(
  {
    HomeScreen: {
      screen: Home,
    },
    AirportMeeting: {
      screen: AirportMeeting,
    },
    MeetingPoint: {
      screen: MeetingPoint,
    },
    DriverDetails: {
      screen: DriverDetails,
    },
    SightSeeing: {
      screen: SightSeeing,
    },
    HotelDetails: {
      screen: HotelDetails,
    },
    FlightDetails: {
      screen: FlightDetails,
    },
    AddSight: {
      screen: AddSight,
    },
    SightSeeingPurchase: {
      screen: SightSeeingPurchase,
    },
    AddMeals: {
      screen: AddMeals,
    },
    HomeCard: {
      screen: HomeCard,
    },
    Trips: {
      screen: Trips,
    },
    FAQ: {
      screen: FAQ,
    },
    Support: {
      screen: Support,
    },
    BeforeTravel: {
      screen: BeforeTravel,
    },
    Weather: {
      screen: Weather,
    },
  },
  {
    defaultNavigationOptions: {
      headerShown: false,
    },
    initialRouteName: 'HomeCard',
    transitionConfig: () => fromRight(),
  },
);
所以基本上在我的tabnavigator主页中,我使用了Appstack,它是一个堆栈导航器

为了防止您好奇,ive alos制作了一个switchnavigator,其中我还添加了tab navigator和其他堆栈Navigtor,因此一切皆有可能:

const navigation = createAppContainer(
  createSwitchNavigator(
    {
      App: TabNavigator,
      Auth: AuthStack,
      SplashScreen: SplashScreen,
    },
    {
      initialRouteName: 'SplashScreen',
    },
  ),
);

两者都在同一个文件中?问题是关于createMaterialTopTabNavigator的。你能举个例子吗?