交换机不是从“反应-路由器-域”导出的

在 package.json 文件中添加了 response-router-dom 依赖项。应用程序组件被 BrowswerRouter 包装，但是当我通过 Switch 包装路由时，它说下面的错误 Switch’不是从“ response-router-dom”导出的。我删除了 package.json.lock、节点模块，再次安装了 npm，并安装了 npm install@babel/core —— save。还是不行。我成功地浪费了6个小时。你能帮我把这个修好吗？为什么不进口？

Index.js

import {BrowserRouter} from 'react-router-dom';


ReactDOM.render(
<BrowserRouter>
<App />
</BrowserRouter>,
document.getElementById('root')
);

App.js:

 import logo from './logo.svg';
import './App.css';
import React from 'react';
import {Switch,Route,Link} from 'react-router-dom';
import Home from './Home';
class App extends React.Component {
componentDidMount(){
alert('mounting');
}
componentDidUpdate(){
alert('updated');
}
render(){
return (
    

<div className="App">
     

<div>
<Link to="/">Home</Link>
</div>


<hr />


<Switch>
<Route exact path="/">
<Home/>
</Route>
</Switch>
 

</div>
 

);
}
}


export default App;


import React from 'react';


const Home = () => {
return <h1>Home</h1>;
};
  

export default Home;

包裹 Json

"dependencies": {
"@babel/core": "^7.16.0",
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router": "^6.0.0",
"react-router-dom": "^6.0.0",
"react-scripts": "4.0.3",
"web-vitals": "^1.0.1"
},
104494 次浏览
小开
最佳答案

在反应路由器 v6中使用 Routes而不是 Switch

您正在使用 react-router-dom版本6，其中 用 Routes 组件替换 Switch

import {
BrowserRouter,
Routes, // instead of "Switch"
Route,
} from "react-router-dom";


// ...


<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
</Routes>
</BrowserRouter>

请注意，您现在还将组件作为 element支持传递，而不是使用子组件。

小开

如果你想使用 Switch，那么安装反应路由器时代版本5。交换机在反应路由器时代版本6中被替换。

npm install react-router-dom@5

小开

用户将无法在 react-router-dom中找到 Switch。他们需要安装最多5个或5个以下的版本。试试下面这个，会有用的。如果用户使用路由而不是 Switch，则可能无法工作。

npm install react-router-dom@5
小开

我也遇到了这个错误，我的 React 导入被删除了。所以也许你只需要看看你是否有进口反应或没有。

小开

您正在使用 response-router@v6，它使用“ Routes”而不是 Switch。 解决方案: - 把「开关」改为「路线」 或者 - 降低你的反应路由器到 v5使用 Npm install response-router-dom@5

检查 https://reactrouter.com/docs/en/v6/upgrading/v5#upgrade-all-switch-elements-to-routes

小开

这个问题是由反应路由器域的版本引起的。所以你不需要做太多，你可以通过卸载旧的反应路由器来安装新版本，这将解决你的问题。卸载之后，你不需要做太多的事情就可以打开你的应用程序文件夹，通过 shift + 右击打开终端。在终端中，运行下面给出的代码。这将卸载您的反应路由器 Dom。 检查这里如何做到这一点’交换机’不是从’反应-路由器-领域’导出


提交答案