登录重定向后的空白页 React.js

Question

我在登录后遇到一个小问题，它将我路由到 /dashboard，但我得到一个空白页面。但是，如果我只是使用相同的路由 /dashboard 刷新页面，页面就会正确加载。

我已经在沙箱中创建了我的项目副本 => https://codesandbox.io/s/event-react-3r96m

你能帮我看看吗？我试图在使用令牌登录后保持会话，但对于沙箱，我使用 user = email@test.com 和 password = test.

插入了一个虚拟 IF

提前致谢！最好的祝福！

Answer 1

问题是您没有在 Auth 组件中更新 app.js 中的 isLoggedIn 变量。

在app.js文件中添加以下函数。

  setLoggedIn = () => {
    this.setState ({isLoggedIn: true});
  }

更改以下内容：

            {!this.state.isLoggedIn && (
              <Route path="/auth" component={AuthPage} exact />
            )}

到

            {!this.state.isLoggedIn && (
              <Route exact path='/auth' render={(props)=>
                <AuthPage {...props} updateStatus={this.setLoggedIn} />}
              />
            )}

在 Auth.js 文件中 handleSubmit 函数调用作为 props 传入的新函数。

this.props.updateStatus();

这是沙盒。 https://codesandbox.io/s/event-react-dzs9x

请注意，我更改了 localStorage 调用，因为它给我一个错误。

登录重定向后的空白页 React.js

Blank page after login redirection React.js

redirect

router

reactjs