Attempted import error: ‘Switch‘ is not exported from ‘react-router-dom‘.
Attempted import error: ‘Switch‘ is not exported from ‘react-router-dom‘.
Hi,我是赵猛,今天是做react项目的第一天,记录一下学习过程中出现的一些问题。
一、
<Switch>
<Route path="/home" component={Home}></Route>
<Route path="/login" component={Login}></Route>
</Switch>
今天配置路由的时候出现了这样的错误:Attempted import error: ‘Switch‘ is not exported from ‘react-router-dom‘.
通过查阅资料知道了是react-router-dom版本的问题,在package.jason中查看版本如下:
在react-router-dom6.0以后Switch就不再使用了,所以需要将Switch修改为Routes,代码如下:
<Routes>
<Route path="/home" component={Home}></Route>
<Route path="/login" component={Login}></Route>
</Routes>
二、通过上述的修改会发现还是会出现错误
会出现这样一个错误提示:Attempted import error: ‘Routes’ is not exported from ‘react-router-dom’.
错误原因是:react-router-dom6.x版本中,不再通过component指定组件,而是通过element进行配置,因此将中的component改为element即可
代码如下:
<Routes>
<Route path="/home" element={<Home></Home>}></Route>
<Route path="/login" element={<Login></Login>}></Route>
</Routes>
三、通过上述两处修改后,无报错
这篇好文章是转载于:学新通技术网
- 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
- 本站站名: 学新通技术网
- 本文地址: /boutique/detail/tanhfhcbkg
系列文章
更多
同类精品
更多
-
photoshop保存的图片太大微信发不了怎么办
PHP中文网 06-15 -
《学习通》视频自动暂停处理方法
HelloWorld317 07-05 -
Android 11 保存文件到外部存储,并分享文件
Luke 10-12 -
word里面弄一个表格后上面的标题会跑到下面怎么办
PHP中文网 06-20 -
photoshop扩展功能面板显示灰色怎么办
PHP中文网 06-14 -
微信公众号没有声音提示怎么办
PHP中文网 03-31 -
excel下划线不显示怎么办
PHP中文网 06-23 -
excel打印预览压线压字怎么办
PHP中文网 06-22 -
TikTok加速器哪个好免费的TK加速器推荐
TK小达人 10-01 -
怎样阻止微信小程序自动打开
PHP中文网 06-13