大家好，又见面了，我是你们的朋友全栈君。
原理
react路由守卫 是通过 高阶组件(HOC) 实现的
因此针对不同的情况就要封装不同的 HOC
接下来展示一个有关登录权限的路由守卫例子
demo
import React from 'react'
import {
Route, Redirect } from 'react-router-dom'
import {
connect } from 'react-redux'
export default connect(({
user }) => ({
isLogin: user.isLogin }))(
function PrivateRoute({
isLogin, component: Component, ...rest }) {
return (
<Route
{
...rest}
render={
props =>
isLogin ? (
<Component {
...props} />
) : (
<Redirect
to={
{
pathname: '/login',
state: {
redirect: props.location.pathname },
}}
/>
)
}
/>
)
}
)
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
发布者：全栈程序员-用户IM，转载请注明出处：https://javaforall.cn/144094.html原文链接：https://javaforall.cn
【正版授权，激活自己账号】： Jetbrains全家桶Ide使用，1年售后保障，每天仅需1毛
【官方授权 正版激活】： 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...
