react JS中的私有路由jsx

import React from 'react';
import { Route, Redirect } from 'react-router-dom';

const PrivateRoute = ({ component: Component, isAuthenticated, ...rest }) => (
  <Route
    {...rest}
    render={props =>
      isAuthenticated ? (
        <Component {...props} />
      ) : (
        <Redirect to="/login" />
      )
    }
  />
);

export default PrivateRoute;

import React from 'react';
import { BrowserRouter as Router, Switch } from 'react-router-dom';
import PrivateRoute from './PrivateRoute';
import HomePage from './HomePage';
import DashboardPage from './DashboardPage';
import LoginPage from './LoginPage';

const App = () => (
  <Router>
    <Switch>
      <Route exact path="/" component={HomePage} />
      <PrivateRoute
        path="/dashboard"
        component={DashboardPage}
        isAuthenticated={isLoggedIn}
      />
      <Route path="/login" component={LoginPage} />
    </Switch>
  </Router>
);

export default App;