javascript - 在加载我的路线之前，请等待onAuthStateChanged

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

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。我可以通过什么方法解决此问题？

最佳答案

您如何在React应用中处理状态？ Redux？助焊剂？用手 ？您是否使用react-router处理路由？

我认为您应该将AuthStatus置于您的状态中。然后，您的组件应基于此状态属性渲染（或不渲染）。

关于javascript - 在加载我的路线之前，请等待onAuthStateChanged，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44865428/