在登录并刷新页面后,react router v5 privateroute将登录

灰色

我正在尝试用React Router实现privateroute,当我第一次登录到我想要的特定页面时出现了一个问题,但是当我刷新页面时,即使登录也进入了登录页面

我的路由器代码:

export default function PsyaRouter() {
  const auth = useSelector((state) => state.auth);

  return (
    <Router>
      <SnackbarProvider maxSnack={4} hideIconVariant={false}>
        <Header>
          <CustomSnackbar />
          <Switch>
            <Route path="/login">
              <Login />
            </Route>
            <Route path="/enterPhone">
              <EnterPhone />
            </Route>
            <Route path="/enterCode">
              <EnterCode />
            </Route>
            <PrivateRoute path="/assessment/create">
              <AssessmentForm />
            </PrivateRoute>
            <PrivateRoute path="/assessment">
              <Assessment />
            </PrivateRoute>
            <Route path="/users">
              <Users />
            </Route>
            <Route path="/groups">
              <Groups />
            </Route>
            <Route path="/not-found">
              <NotFound />
            </Route>
            <Redirect to="/not-found" />
          </Switch>
        </Header>
      </SnackbarProvider>
    </Router>
  );
}

这是我的privateroute实现:

export default function PrivateRoute({ children, ...rest }) {
  const auth = useSelector((state) => state.auth);
  // const { last_role_type: userType } = useSelector((state) => state.user);

  useEffect(() => {
    console.log("router auth obj: ", auth);
  }, []); //auth

  return (
    <Route
      {...rest}
      render={(props) => {
        return auth.isLoggedIn ? (
          children
        ) : (
          <Redirect
            to={{
              pathname: "/enterPhone",
              state: { from: props.location },
            }}
          />
        );
      }}
    />
  );
}
东范

刷新页面时,请重新安装整个应用程序,然后重新设置所有状态。要解决此问题,请使用localStorage或sessionStorage保留身份验证数据,然后在专用路由组件中获取它们以进行验证。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

React Router V5:在动态路由中需要嵌套路由

来自分类Dev

刷新页面后,React-router 2中无法获取/ page_url

来自分类Dev

在React Router上,即使页面刷新也如何保持登录状态?

来自分类Dev

React Router-将api数据传递到链接的组件以打开新页面

来自分类Dev

react-router v5 –嵌套路由

来自分类Dev

使用typescript的React Router v5上必需的url参数,可以不确定

来自分类Dev

登录后的角度刷新页面

来自分类Dev

如何使用React Router将信息传递到新页面?

来自分类Dev

无法在React Router v5上打印嵌套路由的子组件

来自分类Dev

登录后使用react-router-v5和redux-toolkit重定向页面

来自分类Dev

React Router更改URL,但除非从浏览器刷新页面,否则不会更新页面

来自分类Dev

如何在React Router v5中推送到历史记录?

来自分类Dev

React Router Dom v5:无法识别GUID / UUID的正则表达式路径

来自分类Dev

反应路由器V5更新URL但不刷新页面

来自分类Dev

使用react-router-dom V5完成操作后重定向。

来自分类Dev

只有刷新页面后,React Router才能工作

来自分类Dev

如果用户已经登录,则在用户刷新页面时将页面重定向到React js中的仪表板页面

来自分类Dev

登录后刷新页面

来自分类Dev

EmberJS刷新页面要求用户登录

来自分类Dev

[jQuery]在将html附加.html()后刷新页面

来自分类Dev

react-native在Facebook登录和注销后如何刷新页面

来自分类Dev

登录后导航到新页面

来自分类Dev

成功登录GWT Java后如何打开新页面

来自分类Dev

以页面发布到页面时,Facebook PHP SDK v5 OAuth登录错误

来自分类Dev

如何使用React-Router通过<Link>将额外的道具传递到新页面?

来自分类Dev

登录只是刷新页面 php html

来自分类Dev

会话登录不断刷新页面

来自分类Dev

React Router Dom 受保护的路由在刷新页面期间始终重定向到登录

来自分类Dev

react-router 路由 <Link> v5

Related 相关文章

  1. 1

    React Router V5:在动态路由中需要嵌套路由

  2. 2

    刷新页面后,React-router 2中无法获取/ page_url

  3. 3

    在React Router上,即使页面刷新也如何保持登录状态?

  4. 4

    React Router-将api数据传递到链接的组件以打开新页面

  5. 5

    react-router v5 –嵌套路由

  6. 6

    使用typescript的React Router v5上必需的url参数,可以不确定

  7. 7

    登录后的角度刷新页面

  8. 8

    如何使用React Router将信息传递到新页面?

  9. 9

    无法在React Router v5上打印嵌套路由的子组件

  10. 10

    登录后使用react-router-v5和redux-toolkit重定向页面

  11. 11

    React Router更改URL,但除非从浏览器刷新页面,否则不会更新页面

  12. 12

    如何在React Router v5中推送到历史记录?

  13. 13

    React Router Dom v5:无法识别GUID / UUID的正则表达式路径

  14. 14

    反应路由器V5更新URL但不刷新页面

  15. 15

    使用react-router-dom V5完成操作后重定向。

  16. 16

    只有刷新页面后,React Router才能工作

  17. 17

    如果用户已经登录,则在用户刷新页面时将页面重定向到React js中的仪表板页面

  18. 18

    登录后刷新页面

  19. 19

    EmberJS刷新页面要求用户登录

  20. 20

    [jQuery]在将html附加.html()后刷新页面

  21. 21

    react-native在Facebook登录和注销后如何刷新页面

  22. 22

    登录后导航到新页面

  23. 23

    成功登录GWT Java后如何打开新页面

  24. 24

    以页面发布到页面时,Facebook PHP SDK v5 OAuth登录错误

  25. 25

    如何使用React-Router通过<Link>将额外的道具传递到新页面?

  26. 26

    登录只是刷新页面 php html

  27. 27

    会话登录不断刷新页面

  28. 28

    React Router Dom 受保护的路由在刷新页面期间始终重定向到登录

  29. 29

    react-router 路由 <Link> v5

热门标签

归档