当我按照教程中的步骤操作时，React Router 不起作用

Question

我是反应新手，我在 App.js 中有这个，我一直在看教程，但都告诉我需要做什么，但对我不起作用。

import logo from './logo.svg';
import './App.css';
import CoinElement from './Components/Coins/CoinElement';
import CoinHead from './Components/Coins/CoinHead';
import NavigationBar from './Components/Common/NavigationBar';
import { BrowserRouter, Route, Routes, Link } from 'react-router-dom';
import CoinsPage from './Components/Coins/CoinsPage';
import ExchangesPage from './Components/Exchanges/ExchangesPage';
import * as React from 'react';

export default class App extends React.Component {
  render(){
  return (
    <div className="App">
        <NavigationBar></NavigationBar>
        <BrowserRouter>
        <h2>Welcome to React Router Tutorial</h2>
          <nav className="navbar navbar-expand-lg navbar-light bg-light">
          <ul className="navbar-nav mr-auto">
            <li><Link to={'/'} className="nav-link"> Home </Link></li>
            <li><Link to={'/coins'} className="nav-link">Contact</Link></li>
            <li><Link to={'/exchanges'} className="nav-link">About</Link></li>
          </ul>
          </nav>
          <hr />
            <Routes>
             <Route path="/coins" component={CoinsPage}/>
             <Route path="/exchanges" component={ExchangesPage}/>
            <Route component={Error}/>
           </Routes>
           </BrowserRouter>
    </div>
  );
}
}

Answer 1

我认为你错过了<Switch>

   <Switch>
        <Route path="/coins" component={CoinsPage}/>
        <Route path="/exchanges" component={ExchangesPage}/>
        <Route component={Error}/>
   </Switch>

https://v5.reactrouter.com/web/guides/quick-start