import React, { Component } from 'react';
import {Redirect} from 'react-router-dom'
import { connect } from 'react-redux'
import './App.less';
class App extends Component {
render() {
const { userInfo } =this.props
// console.log(userInfo)
if (userInfo.get('token')==='') {
return (
<div className="App">
<Redirect to="/login"/>
{ this.props.children }
</div>
)
}else {
return (
<div className="App">
{ this.props.children }
</div>
)
}
}
}
const mapState=(state)=>({
userInfo:state.getIn(['header', 'userInfo'])
})
const mapDispatch=()=>({
})
export default connect(mapState, mapDispatch)(App)下面是路由设置
import React from 'react'
import App from './App'
import {HashRouter,Route,Switch} from 'react-router-dom'
import { Provider } from 'react-redux'
import Admin from './admin'
import Home from './pages/home'
import Login from './pages/login'
import Page404 from './pages/404'
import LoginForm from './pages/form/login'
import Button from './pages/ui/button'
import BasicTable from './pages/ui/table/basicTable'
import User from './pages/rbac/user'
import Role from './pages/rbac/role'
import Menu from './pages/rbac/menu'
import store from "./store";
export default class Router extends React.Component{
render(){
return (
<Provider store={store}>
{/*不管传什么组件过来,优先加载App this.props.children 匹配到的路由加载组件到这个位置*/}
<HashRouter>
<App>
<Route path="/login" exact component={Login}/>
<Route exact path="/" render={() =>
// 将Admin组件加载进来
<Admin>
<Switch>
<Route path="/" component={Home}/>
<Route path="/admin/form/login" component={LoginForm}/>
<Route path="/admin/ui/buttions" component={Button}/>
<Route path="/admin/table/basic" component={BasicTable}/>
<Route path="/admin/upms/user" component={User}/>
<Route path="/admin/upms/role" component={Role}/>
<Route path="/admin/upms/menu" component={Menu}/>
<Route component={Page404}/>
</Switch>
</Admin>
}/>
</App>
</HashRouter>
</Provider>
)
}
}