React with params中的嵌套路由

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

// 定义父组件
const ParentComponent = () => {
  return (
    <div>
      <h1>父组件</h1>
      <<ul>
        <li><Link to="/parent/child1">子组件1</Link></li>
        <li><Link to="/parent/child2">子组件2</Link></li>
      </ul>
      <Switch>
        <Route path="/parent/child1" component={ChildComponent1} />
        <Route path="/parent/child2" component={ChildComponent2} />
      </Switch>
    </div>
  );
};

// 定义子组件1
const ChildComponent1 = () => {
  return (
    <div>
      <h2>子组件1</h2>
      <p>这是子组件1的内容。</p>
    </div>
  );
};

// 定义子组件2
const ChildComponent2 = () => {
  return (
    <div>
      <h2>子组件2</h2>
      <p>这是子组件2的内容。</p>
    </div>
  );
};

// 在根组件中使用路由
const App = () => {
  return (
    <Router>
      <Switch>
        <Route path="/parent" component={ParentComponent} />
      </Switch>
    </Router>
  );
};

export default App;