如何渲染选项卡同时导航和堆栈导航

Question

我正在尝试同时使用堆栈导航和标签导航，我已经在我的app.js文件中创建了一个堆栈导航器和标签，但每当我的应用加载时，他们同时显示不同的页面，我不知道如何解决此问题。我的app.js代码是

import { createStackNavigator, createAppContainer } from 'react-navigation';
import IntroSlides from './src/screens/introslides/introslides';
import Dashboard from './src/screens/dashboard/dashboard';
import InboxScreen from '../screens/inbox/inbox';
import Favourites from '../screens/favourite/favourite';

const MainNavigator = createStackNavigator({
  dashboard: { screen: Dashboard },
  intro: { screen: IntroSlides },
 }, {
  headerMode: 'none',
  navigationOptions: {
     headerVisible: false,
  }
});
const TabNavigator = createBottomTabNavigator({
   // dashboard: { screen: Dashboard },
   Inbox: { screen: InboxScreen },
   Favourites: { screen: Favourites }
});

const App = createAppContainer(MainNavigator);    

export default App;

当应用程序加载堆栈同时显示页面时，任何帮助将不胜感激

Answer 1

以下是一起使用选项卡导航器和堆栈导航器的示例：

const Stylelist = StackNavigator({
  Login: {
    screen: LoginScreen,
    navigationOptions: ({ navigation }) => ({
      header: null,
    }),
  },
  Register: {
    screen: RegisterScreen,
    navigationOptions: ({ navigation }) => ({
      header: null,
    }),
  },
  Home: {
    screen: TabNavigator({
      Home: {
        screen: HomeScreen,
        navigationOptions: ({ navigation }) => ({
          title: 'Home',
        }),
      },
      Friends: {
        screen: FriendsScreen,
        navigationOptions: ({ navigation }) => ({
          title: 'My Friends',
        }),
      },
    }),
    navigationOptions: ({ navigation }) => ({
      title: 'Home',
    }),
  },
});

export default Stylelist;