在加载我的路线之前等待 onAuthStateChanged答案

【问题标题】：Wait for onAuthStateChanged before loading my route在加载我的路线之前等待 onAuthStateChanged
【发布时间】：2017-12-05 12:48:11
【问题描述】：

我正在尝试制作一个跟踪用户身份验证状态的模块。它目前看起来像这样：

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。在我开始导航到其他路线后，它工作正常，但只是第一页加载总是返回 false，因为 onAuthStateChanged 尚未触发。有什么办法可以解决这个问题？

【问题讨论】：

标签： javascript reactjs firebase-authentication

【解决方案1】：

您如何处理 React 应用中的状态？还原？通量？用手？你用 react-router 来处理路由吗？

我认为您应该将AuthStatus 放在您所在州的某个地方。然后你的组件应该根据这个 state 属性渲染（或不渲染）。

【讨论】：

你会怎么等？