react js路由器路由到嵌套路由器中的外部路由器

import React from 'react';
import { BrowserRouter as Router, Route, Link, useHistory } from 'react-router-dom';

const Home = () => <div>Home</div>;
const About = () => <div>About</div>;
const Dashboard = () => (
  <div>
    <h1>Dashboard</h1>
    <NestedRoute />
  </div>
);
const NestedRoute = () => {
  const history = useHistory();

  const handleNavigateToAbout = () => {
    history.push('/about');
  };

  return (
    <div>
      <h2>Nested Route</h2>
      <button onClick={handleNavigateToAbout}>Go to About</button>
    </div>
  );
};

const App = () => (
  <Router>
    <nav>
      <ul>
        <li>
          <Link to="/">Home</Link>
        </li>
        <li>
          <Link to="/about">About</Link>
        </li>
        <li>
          <Link to="/dashboard">Dashboard</Link>
        </li>
      </ul>
    </nav>
    <Route path="/" exact component={Home} />
    <Route path="/about" component={About} />
    <Route path="/dashboard" component={Dashboard} />
  </Router>
);

export default App;