反応ナビゲーションでアプリケーションを開くときにユーザーがログインしていない場合はログイン画面を表示

Question

メインタブナビゲータを持つアプリケーションを作成しようとしていますが、ログインしていない場合は、ログイン画面（しかし、私はまだログインをスキップするオプションを取得したい）。

また、初めてユーザーがアプリを開くと、私はアプリを説明するオンボーディング/ウェルカム画面を表示したいと思います。

今の私はredux-persistと永続化していますので、アプリを開いたとき（つまり、バックグラウンドで開いていなくても）、ログインしていなければLoginの画面が表示されますMain画面ユーザーがすでにログインしている場合。

私は、スタックのナビゲーターは画面WelcomeScreen、LoginScreenとMainを有するように、スタックナビゲータでネストされて私の主なタブナビゲータを持っている必要があることを理解しています。

しかし、初めてアプリを開いたときにユーザーがログインしているのを確認してからLogin画面にリダイレクトするにはどうすればよいですか？私はhttps://github.com/react-community/react-navigation/blob/master/examples/ReduxExample/src/reducers/index.jsを見てきましたが、それはfirstAction、tempNavState、およびsecondActionが意味するものはあまり直感的ではありません。

ユーザーがログインしているかどうかを確認するミドルウェアを作成する必要がありますか？

Answer 1

ユーザーがログインしているかどうかを確認し、それに応じてルートコンテナがログイン状態を確認します。 ユーザーフレンドリーである彼はポストに使用されるようなこのポスト Login exampleではなく、ユーザーがログインしているかを決定するためにReduxの状態を使用して非同期ストレージを使用していない参照してください。 もう一つのトリックはreact-native-splash-screenを使用し、これを使用してスプラッシュ画面を非表示にしていないです2秒間待機すると、redux-persistアクションが送出され、状態を復元し、この期間中にナビゲートすることができます。 この方法ではちらつきはありません。

class AppWithNavigationState extends Component { 
    componentDidMount() { 
     setTimeout(()=>{ 
      if(this.props.loggedIn) 
       { NavigationActions.navigate({ routeName: 'Main' }), } 

       setTimeout(SplashScreen.hide, 500) 
    }) 
    }}