如何管理单页上的两个导航：一个是createstack navigator，另一个是drawer navigator？

提问者：小点点

如何管理单页上的两个导航：一个是createstack navigator，另一个是drawer navigator？

导出默认类App扩展React。组件渲染

return(
  <MyApp />
  );
 return(

  <Navigation />
  );

}

const Navigation = createStackNavigator({

欢迎：{屏幕：飞溅，导航选项：{标题：空}}，登录：{屏幕：请求登录，导航选项：{标题：“登录”，标题标题标题样式：{对齐自我：“中心”，文本对齐：“中心”，宽度：“77%”}，标题样式：{背景颜色：“#095473”}，标题颜色："白色"}}，

忘记：{屏幕：忘记，导航选项：{标题："忘记密码"，标题标题样式：{对齐自己："中心"，文本对齐："中心"，宽度："77%"}，标题样式：{背景颜色："#095473"}，标题颜色："白色" } } });

const MyApp = DrawerNavigator(

{主页：{屏幕：注册，导航选项：{抽屉标签：'Home'，抽屉图标：（）=

    />
    ),
    }
},
Profile: {
  screen: Profile_Requester,
  navigationOptions: {
    drawerLabel: 'Profile',
    drawerIcon: () => (
      <Icon
      name="user-circle"
      size={25}
      color="black"
      //style={styles.useraccounticon}

    />
    ),
    }
},

}）；

在上面的代码中，我使用了两个用于导航的导航CreateStack navigation。用于Myapp的抽屉导航器。但就我而言，只有我的应用程序在工作。请给一些想法如何返回正确的方式都将工作。非常感谢。

共1个答案

匿名用户

看起来您正在尝试实现身份验证流。您应该使用createSwitchNavigator并将其他导航器嵌套在其中。SwitchNavigator可以帮助你进行身份验证，因为它可以处理一些事情，比如确保你不能使用后退按钮从登录屏幕跳转到你的主应用。

其思想是，您将有一个SwitchNavigator作为具有两个流的父导航器：用户是否登录。子导航器类似于Auth和Main。如果用户未登录，活动导航器将是Auth，它本身就是一个StackNavigator。如果用户已登录，则活动导航器将是一个带有堆叠的StackNavigator的DrawerNavigator。

import { createSwitchNavigator, createStackNavigator, createDrawerNavigator } from 'react-navigation';

const App = createDrawerNavigator({ AppStack: AppStack });
const AppStack = createStackNavigator({
  Home: { screen: Reqlogin },
  Profile: { screen: Profile_Requester }
});
const Auth = createStackNavigator({
  Welcome: { screen: Splash },
  Login: { screen: Requesterlogin },
  Forgot: { screen: Forgot }
});

export default createSwitchNavigator(
  {
    AuthLoading: AuthLoadingScreen,  // You'll check whether user is logged in or not here
    App: AppStack,
    Auth: AuthStack,
  },
  {
    initialRouteName: 'AuthLoading',
  }
);

有关更多帮助，请访问本文档和本文。