'Switch' 不是从'react-router-dom' 导出的 - JavaScript

简介

在使用 React.js 进行开发时，通常会使用 react-router-dom 库来进行应用的路由管理。其中，<Switch> 组件被广泛使用来匹配当前 URL 与路由表中的路径，并渲染出对应的页面组件。

然而，有时候会出现如下错误信息：

'Switch' is not exported from 'react-router-dom'

这个错误提示说的是 <Switch> 组件没有从 react-router-dom 库中导出。这是什么原因呢？下面我们来分析一下。

原因

这个错误发生的原因是因为你正在使用来自版本 6 或更高版本的 react-router 库，而 <Switch> 组件已经被移动到了 @react-router/core 库中，因此你不能在 react-router-dom 库中找到它。

如果你确实需要使用 <Switch> 组件，可以在项目中安装 @react-router/core 库，并将 Switch 组件从该库中导入。

解决方法

假设您已经使用 npm 或 yarn 安装了 @react-router/core，那么您可以按照以下方式导入 <Switch> 组件：

import { Switch } from '@react-router/core';

这个简单的更改就能够解决错误信息中提到的问题。

除此之外，请确保您的 react-router 和 react-router-dom 的版本匹配。通常情况下，它们应该是相同的版本。

总结

菜鸟们在使用 React.js 进行开发时，可能会遇到一个错误提示：'Switch' is not exported from 'react-router-dom'，这时我们需要注意，这个错误提示是因为我们正在使用来自版本 6 或更高版本的 react-router 库，而 <Switch> 组件已经被移动到了 @react-router/core 库中。因此，我们需要从该库中导入 <Switch> 组件，通过这个简单的更改即可解决问题。