今天导入react-router-dom，出现了这个错误：模块““react-router-dom“”没有导出的成员“Switch”

今天导入react-router-dom，出现了这个错误：模块“"react-router-dom"”没有导出的成员“Switch”。

原来是因为版本问题，最新install的版本是"react-router-dom": "^6.3.0",

所以想要解决这个问题，有两个思路，1.改成版本6的写法；2.降版本

下面我们逐一说明：

1.改成版本6的写法，我们可以用，Routes代替Switch

import { BrowserRouter, Route, Routes } from "react-router-dom"

<Routes>

<Route exact path="/" element={<HomePage/>} />

...

</Routes>

上面的代码需要注意，<Route exact path="/" component={HomePage}> 这句是原来用switch的写法，注意版本不同写法不同。

2.降版本

npm install react-router-dom@5.2.0（这里5.2.0是你需要的任意版本即可）

---------------------------

下面来说一下，这个 版本6 的一些小变化

Routes：

代替Switch组件,不会向下匹配
用来包裹Route
Route：

必须被Routes组件包裹
component属性变成element
caseSensitive 路径大小写敏感属性，默认是不敏感（访问/about = /ABOUT）
index 与path属性是互斥的，index表示为当前路由的根
可以用作layout组件，不写element属性，写了要与 Outlet组件配合使用（嵌套路由）
Navigate：

用来代替Redirect组件
replace属性 跳转模式 "PUSH" | "REPLACE"
只要这个组件一渲染就会发生跳转
NavLink：

className，自定义激活时的样式名 可以为字符串或者函数
end 匹配子路由时是否高亮
caseSensitive 代表匹配路径时是否区分大小写
等等

补充exact好像不能用了，exact 为true表示严格匹配，false不严格。
————————————————
版权声明：本文为CSDN博主「来两碗饭」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/chhpearl/article/details/125750784