如果你正在使用react-router-dom v6，你必须改变Switch到Routes，如下面的例子所示:

而不是导入Switch， import {Switch，…} from 'react-router-dom';

进口航线 import{路由，…} from 'react-router-dom';

然后，不要使用component ={ComponentName}，而是使用element={<ComponentName/>}，如下所示:

import { Routes, Route, ...} from 'react-router-dom';
    .
    .
    .  
    <Routes>
      <Route exact path='/' element={<Home/>}></Route>
    </Routes>

我也遇到过同样的问题，我已经删除了react-router-dom，然后重新安装了它。

出现这个问题是因为我已经将它升级到最新版本，即react-router-dom v6，然后想降级到以前的版本，即v5。

我在Ruby on Rails项目中使用yarn来管理依赖项，你可以使用这个命令来删除和重新安装它:

Yarn remove react-router-dom

Yarn添加react-router-dom

这应该能解决问题。

import {
      BrowserRouter as Router,
      Routes,
      Route,
      Link
    } from "react-router-dom";
    
    function App() {
      return (
        <>
        <Router className="App">
          <Navbar/>
          <Routes>
            <Route path='/'>
    
            </Route>
          </Routes>
        </Router>
        </>
      );
    }
    
    export default App;

如果你安装了react-router和react-router-dom v6 beta，就像这样卸载:

npm uninstall --save react-router react-router-dom

然后用这个安装:

npm install --save react-router react-router-dom

它将安装非beta版的最新版本。

然后我们只需要重新启动Visual Studio Code或任何你处理它的文本编辑器。

写入<路由>而不是<交换机>。

在终端中运行:

npm install --save react-router react-router-dom

这对我很有帮助。或检查文件包。在“react-dom”后面添加以下内容:“^17.0.2”，

 "react-router": "^6.0.0",

React-router-dom已更新到版本6。现在他们已经将<Switch/>组件重命名为<Routes/>。也有很多变化。

您应该花些时间阅读文档。下面是react-router-v6-doc的链接。