reactjs - 启动时反应检查身份验证
问题描述
我现在有一个需要登录的 React 网站。当您加载页面时,react 需要检查您是否已登录(通过调用网络服务器)。
如果用户已登录 ( isAuthenticated = true
),则会向用户显示网站,如果 ( isAuthenticated = false
),则会显示登录页面。
isAuthenticated = false
默认情况下,如果用户已登录,则用户会在检查用户登录之前简要查看登录页面。
其他网站如何处理这个问题?看起来 Facebook 能够在启动时知道您是否已登录。
解决方案
听起来您已经设置了身份验证,您只是想阻止经过身份验证的用户在初始加载时看到登录页面在屏幕上闪烁。
如果是这种情况,您可以最初设置isAuthenticated
为非布尔值(null
或undefined
),在进行身份验证时显示加载组件,并仅在准备好时呈现应用程序。
例如,在您的主 App 文件中,您可以使用以下内容:
render() {
// use strict equality check
return isAuthenticated === null ? <IsLoading /> : <App />
}
<IsLoading />
加载微调器在哪里,并且<App />
是您当前从一开始就渲染的组件。
推荐阅读
- .net - ASP.NET MVC 5 项目文件夹中缺少脚本文件夹
- javascript - 如何使用javascript中的提示输入在对象类中添加新对象
- c++ - 如何在 g++ 10 中使用范围?
- excel - 关于如何将硬编码值转换为变量的 VBA Excel 宏问题
- java - 在 .m2 中配置 maven 注册表
- discord - 将消息复制并发送到另一个频道后删除
- ansible - 使用 ansible 在 tmux 中运行服务器
- javascript - (已更新)尝试使用嵌套表在 tablesorter 中编辑切换功能的行为
- c++ - C++ 未定义的引用错误,同时使用标头
- javascript - 如何在 JSX 中映射()?错误:渲染没有返回任何内容。这通常意味着缺少 return 语句。或者,不渲染任何内容,返回 null