私のルートをロードする前にonAuthStateChangedを待つ

Question

ユーザーの認証ステータスを追跡するモジュールを作成しようとしています。また、このような現在のルックス：

import FbApp from './firebase-app'; 
var AuthStatus = { 
    LoggedIn: false, 
    Username: null, 
    Loaded: false 
}; 

const auth = FbApp.auth(); 

auth.onAuthStateChanged(firebaseUser => {  
    if(firebaseUser){ 
     console.log("user authed!"); 
     AuthStatus.LoggedIn = true; 
    }else{ 
     AuthStatus.LoggedIn = false; 
    } 
    if(!AuthStatus.Loaded){ 
     AuthStatus.Loaded = true;    
    } 
}); 

export default AuthStatus; 

私は私のコンポーネントの多くにAuthStatusをインポートするが、唯一の問題は私の全体のルートがロードされる前に、そのは、常に最初の時間にAuthStatus.LoggedIn = falseとして表示して、これがオフに解雇しないでページの読み込み。 onAuthStateChangedがまだ起動されていないので、最初のページの読み込みは常にfalseを返すだけです。私はこれを解決する方法は何ですか？

Answer 1

あなたのリアクションアプリでどのように状態を処理しますか？ Redux？フラックス？手で ？あなたはルーティングを扱うために反応ルータを使用しますか？

あなたの州のどこかにAuthStatusを置くべきだと思います。次に、コンポーネントはこの状態属性に基づいてレンダリングするかどうかを決定します。