68

I am trying to use react-navigation to create an initial LOGIN screen that has no tabbar and header, and once the user has been successfully authenticated will navigate to another screen called LISTRECORD which has a tabbar, header and no back button option. Anyone has experience in this and can share?

In summary, what I'm trying to achieve with react-navigation is described below...

Screen 1: Login Screen (No Header & Tabbar)
Authenticated...
Screen 2: LISTRECORD (Header, Tabbar and No Back Button)
The tabbar contains other tabs too for navigation to Screen 3, Screen 4...

4

10 に答える 10

3

react-navigationSwitchNavigator目的の動作とナビゲーターの切り替えに役立つ が追加されました。現在、それに関するドキュメントはあまりありませんが、ライブラリによって作成された非常に優れたサンプル スナックがあり、単純な認証フローの実装を示しています。ここで確認できます。

SwitchNavigator リファレンス

SwitchNavigator(RouteConfigs, SwitchNavigatorConfig)

ドキュメントの例

const AppStack = StackNavigator({ Home: HomeScreen, Other: OtherScreen });
const AuthStack = StackNavigator({ SignIn: SignInScreen });

export default SwitchNavigator(
  {
    AuthLoading: AuthLoadingScreen,
    App: AppStack,
    Auth: AuthStack,
  },
  {
    initialRouteName: 'AuthLoading',
  }
);
于 2018-04-10T08:37:27.877 に答える