javascript - 如何使用 react-router-dom v4 保护一个管理页面？

Question

我正在创建一个具有不同页面的网站。它在前端使用 React.js，在后端使用 Express。基本上它是一个 MERN 堆栈。

对于导航，我使用 react-router-dom v4。路由就像一个魅力。现在我必须保护一页。我已经尝试使用 reacttraining.com 文档，但没有成功。

我的 App.js：

import React from 'react';
import { BrowserRouter as Router, Route, Switch, Redirect } from 
'react-router-dom';
import createBrowserHistory from 'history/createBrowserHistory';

const history = createBrowserHistory();

import Home from './Home.jsx';
import Intro from './IntroVideo.jsx';
import Question from './Question.jsx';
import FormPage from './FormPage.jsx';
import Dashboard from './AdminPage.jsx'
import Login from './Login.jsx'
import NotFound from './NotFound.jsx'

 export default class App extends React.Component{
   constructor() {
     super();
     this.state = {
       redirectTo: null
     }
     this.checkAuth = this.checkAuth.bind(this);
   }
   checkAuth(){
     this.setState({
       redirectTo: '/login'
     });
   }
   render() {
     return (
       <Router history={history}>
    <Switch>
      <Route exact path="/" component={Home}/>
      <Route exact path="/intro" component={Intro}/>
      <Route exact path="/question" component={Question}/>
      <Route exact path="/form" component={FormPage} />
      <Route exact path="/dashboard" component={Dashboard} onEnter=
{this.checkAuth} />
      <Route exact path="/login" component={Login} />
      <Route component={NotFound} />
    </Switch>
  </Router>
     )
   }
 }

我的问题的正确解决方案是什么？'/dashboard' 需要受到保护，只有在您登录时才能看到。

感谢您的帮助；）