英文:
I have this error: " xport 'Switch' (imported as 'Switch') was not found in 'react-router-dom' "
问题
我有 react-dom 版本 ^18.2.0。
导入 Home 组件:
import Home from "./Home";
导入 Navebar 组件:
import Navebar from "./Navbar";
导入路由相关的组件:
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
App 组件的代码如下:
function App() {
return (
<Router>
<div className="App">
<Navebar/>
<div className="content">
<Switch>
<Route path="/">
<Home />
</Route>
</Switch>
</div>
</div>
</Router>
);
}
export default App;
英文:
** I have react-dom v^18.2.0**
>And My Code:
import Home from "./Home";
import Navebar from "./Navbar";
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
function App() {
return (
<Router>
<div className="App">
<Navebar/>
<div className="content">
<Switch>
<Route path="/">
<Home />
</Route>
</Switch>
</div>
</div>
</Router>
);
}
export default App;
答案1
得分: 0
Here is the translated content:
如果您正在使用 react-router-dom 版本6或更高版本,应该使用 Routes 替代 Switch:
import Home from "./Home";
import Navbar from "./Navbar";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
function App() {
return (
<Router>
<div className="App">
<Navbar />
<div className="content">
<Routes>
<Route path="/">
<Home />
</Route>
</Routes>
</div>
</div>
</Router>
);
}
export default App;
请根据 react-router-dom 从版本5升级到版本6的文档进行更新:
英文:
if your using react-router-dom v6 or greater than in place of Switch use Routes :-
import Home from "./Home"; import Navebar from "./Navbar";
import { BrowserRouter as Router, Route, Routes} from "react-router-dom";
function App() {
return (
<Router>
<div className="App">
<Navebar />
<div className="content">
<Routes>
<Route path="/">
<Home />
</Route>
</Routes>
</div>
</div>
</Router>
);
}
export default App;
please follow react-router-dom updating documentation from v5 to v6 :-
> doc-link
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论