Reactjs React路由器PrivateRoute不工作。我错过了什么?

Reactjs React路由器PrivateRoute不工作。我错过了什么?,reactjs,react-router,private,Reactjs,React Router,Private,我的react redux专用路由器不工作。 它只是向我展示了我试图访问的路线的空白页。 我的州没有在Redux开发工具上加载。 这也可能是HashRouter的问题吗? My PrivateRoute组件: import React from "react"; import { connect } from "react-redux"; import {Router, Redirect, withRouter } from "react-router-dom"; import PropType

我的react redux专用路由器不工作。 它只是向我展示了我试图访问的路线的空白页。 我的州没有在Redux开发工具上加载。 这也可能是HashRouter的问题吗? My PrivateRoute组件:

import React from "react";
import { connect } from "react-redux";
import {Router, Redirect, withRouter } from "react-router-dom";
import PropTypes from 'prop-types';
class PrivateRoute extends React.Component {
  static propTypes = {
    isAuthenticated: PropTypes.bool,
  }
  isLoggedin = () => {
    return this.props.isAuthenticated;
  };

  render = () => {
    let { component: Component, ...rest } = this.props;

    return (
      <Router
        {...rest}
        render={(props) =>
          this.isLoggedin() ? (
            <Component {...props} />
          ) : props.location.pathname === "/" ? null : (
            <Redirect to="/" />
          )
        }
        />
    );
  };
}

const mapStateToProps = (state) => ({
    auth: state.auth,
    isAuthenticated: state.auth.isAuthenticated
})

export default withRouter(connect(mapStateToProps, null)(PrivateRoute));
从“React”导入React;
从“react redux”导入{connect};
从“react Router dom”导入{Router,Redirect,withRouter};
从“道具类型”导入道具类型;
类PrivateRoute扩展了React.Component{
静态类型={
已验证:PropTypes.bool,
}
伊斯洛格丁=()=>{
返回this.props.isAuthenticated;
};
渲染=()=>{
让{component:component,…rest}=this.props;
返回(
这个.isLoggedin()(
):props.location.pathname==“/”?空:(
)
}
/>
);
};
}
常量mapStateToProps=(状态)=>({
auth:state.auth,
isAuthenticated:state.auth.isAuthenticated
})
使用路由器导出默认值(connect(MapStateTops,null)(PrivateRoute));
我的应用程序,我正在包装我的路线,使其成为私人:

import {Provider} from 'react-redux';
import store from './store'
import {loadUser} from './actions/authActions'
import PrivateRoute from './components/auth/PrivateRoute'


class App extends React.Component {
    componentDidMount(){
        store.dispatch(loadUser())
    }

    render(){
        return (
            <Provider store={store}>
                <HashRouter basename="/">
                    <Navbar />
                    <Route exact  path="/" component={Home}/>
                    <PrivateRoute path="/aeons" component={AeonsList} />
                    <PrivateRoute path="/carrefours" component={CarrefoursList} />
                    <PrivateRoute path="/farmers" component={FarmersList} />
                    <PrivateRoute path="/foodhalls" component={FoodhallsList} />
                    <PrivateRoute path="/grands" component={GrandsList} />
                    <PrivateRoute path="/heros" component={HerosList} />
                    <PrivateRoute path="/primos" component={PrimosList} />
                    <PrivateRoute path="/ranchos" component={RanchsList} />
                </HashRouter>
            </Provider>

        )
    }
}

export default App;
从'react redux'导入{Provider};
从“./store”导入存储
从“./actions/authActions”导入{loadUser}
从“./components/auth/PrivateRoute”导入PrivateRoute
类应用程序扩展了React.Component{
componentDidMount(){
store.dispatch(loadUser())
}
render(){
返回(
)
}
}
导出默认应用程序;

定义privateRoute组件时,需要导入
路由
,而不是
路由器

从“react router dom”导入{Route}

检查