首页 > 解决方案 > 为什么即使我已登录,我也无法访问仪表板路线?

问题描述

我在我的应用程序中使用私有路由来访问仪表板。如果我没有登录,它会正常工作并将我重定向到登录页面。但即使我已登录,它也无法访问仪表板。这是我的代码。

应用程序.js

import React from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Home from './containers/Home';
import Login from './containers/Login';
import Dashboard from './containers/Dashboard';
import PrivateRoute from './components/PrivateRoute';
import { Provider } from 'react-redux';
import store from './store';

const App = () => (
  <Provider store={store}>
    <Router>
      <Layout>
          <Switch>
            <Route exact path='/' component={Home} />
            <PrivateRoute exact path='/dashboard' component={Dashboard} />
            <Route exact path='/login' component={Login} />
          
 
          </Switch>
      </Layout>
    </Router>
  </Provider>
);

export default App;

PrivateRoute.js

import React from 'react';
import { Route, Redirect } from 'react-router-dom';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
const PrivateRoute = ({ component: Component, auth, ...rest }) => (
  <Route
    {...rest}
    render={(props) => {
       if (!auth.isAuthenticated) {
         return <Redirect to="/login" />;
        
      } else {
        return <Component {...props} />;
      }
    }}
  />
);

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

export default connect(mapStateToProps)(PrivateRoute);

如果我在 react redux 工具上登录,我的状态是这些状态

我注意到即使 isAuthanticated 在登录后变为真,但privateRoutes.js 的其他部分从未调用

标签: javascriptreactjsdjangoreact-nativeredux

解决方案


推荐阅读