react router 路由守卫

Jay_帅小伙

于 2020-05-13 11:36:41 发布

阅读量331

点赞数 1

CC 4.0 BY-SA版权

分类专栏： react

本文链接：https://blog.csdn.net/qq_42975676/article/details/106094334

react 专栏收录该内容

13 篇文章

订阅专栏

本文介绍如何使用React Router DOM库中的Route组件创建私有路由，确保只有登录用户才能访问特定页面。通过判断isLogin状态，实现对未登录用户的重定向至登录页，并保存重定向前的路径。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

import ｛Route，Redirect｝from “react-router-dom”
const PrivateRoute = ({component:Component, ...rest}) =>(
  <Route
    {...rest}
    render={props=>{
       return isLogin ?
       <Component {...props}>
       :
       <Redirect
         to={{
            pathname:'/login',
            state:{redirect:props.location.pathname}
          }}
       >
    }}
  />
)