反应生命周期/架构和Firebase身份验证

Question

有一个组件可以挂载功能。

componentDidMount() {
    const {onSignedIn} = this.props;

    auth.onAuthStateChanged((user) => {
        if (user) {
            onSignedIn(user);
        }
    });
}

基本上，它将检查firebase是否具有有效的登录会话，如果有，则将该用户登录。简单。

现在的问题是，我已经设置了各种受保护的路由，只有登录后才能访问。

如果您通过应用程序中的链接导航至这些，则一切正常 但是，如果您尝试通过地址栏直接转到这些路线之一，则会发生奇怪的事情。基本上，它将重新加载页面，用户已注销，因此路由（正确）将您重定向到登录页面，然后上述方法运行并登录。

问题在于该组件只能安装一次，因此当您在应用内浏览时，不会进行重新安装，并且一切正常。如果您刷新页面或使用地址栏，则会发生上述情况。

与其说是代码问题，不如说是架构问题，但我不确定如何最好地解决它。