React 权限操作

import React, { Component, Suspense,lazy } from 'react'
import { BrowserRouter as Router, Redirect, Route, Switch } from 'react-router-dom'
import Login from '../login'
import ApIRouters from './routers'
import notFound from '../notFound/index'
class AuthRouters extends Component {
    render() {
        const isLogin = localStorage.getItem('isLogin', true);
        return (
            <Router>
                <Switch>
                    <Route path="/" exact component={Login} />
                    <Route path="/login" component={Login} />
                    <Route path="/notfound" component={notFound} />
                    {isLogin?<Suspense fallback={<h1>...</h1>}>
                       {ApIRouters.map((v,i)=>{
                           if(v.path!=='/notfound'){
                            return (
                                <Route path={v.path} component={v.componet} key={i}></Route>
                               )
                           }else{
                               return  (<Redirect to="/notfound" key={i}/>)
                           }
                          
                       })}
                    </Suspense>
                    :
                    (<Redirect  to={{pathname:'/login'}} />)}
                    
                </Switch>
            </Router>

        )
    }
}
// http://gitlab-gaodun-cn-0/react.tb/yanPanJun.git
export default AuthRouters


import {lazy} from 'react'
export default [
    {
        path:"/info",
        componet:lazy(()=>import('../detail/index'))
        
    },
    {
        path:"/list",
        componet:lazy(()=>import('../list/index'))
    }
]



const  defaultStatus={
    isLogin:false,
    isAuth:false
}
export default (preState = defaultStatus, { type, value }) => {
    //这样就解决了全局跳转和请求超时的问题了
    switch (type) {
        case 'legitimate':
            return { ...preState, ...value }
        case 'wrongful':
            return { ...preState, ...value}
        default:
            return { ...preState }
    }

}


import axios from 'axios'
const http = axios.create({
    host: '',
    timeout: ''
})
http.interceptors.request.use(config => {
    localStorage.getItem('token')
    if (token) {
        config.header = {
            'Content-Type': 'application/x-www-form-urlencoded',
            Authorization: 'Authorization ' + token
        }
    }
    return config
})
http.interceptors.response.use(respone => {
    if (response.code) {
    
    }
    
    return response

}, (error) => {
    return Promise.reject(error.message)
})
export function get(url, params = {}) {
    return http.get(url, qs.stringify(params))
}
export function post(url, data) {
    return http.post(url, data ? qs.stringify(data) : data)
}

补充了一下当时也就是你的全局登录登录还有请求超时以后前端提示以及登录以后访问不存在的页面路径：