因此，我在 YouTube 上為 Academind 的初學者學習了 React 速成課程。我一直在關注一切，一切都很好，直到我來到路由部分。我遵循了每一步，一切都非常完美（對于路由部分），但重繪 頁面后出現以下錯誤：
A
<Route>只能用作<Routes>元素的子元素，從不直接渲染。請<Route>用<Routes>.
Aaand 我做到了，我將 Route 包裹在 Routes 中：
import { Route } from 'react-router-dom';
import AllMeetupsPage from './Pages/AllMeetups';
import NewMeetupsPage from './Pages/NewMeetups';
import FavoritesPage from './Pages/Favorites';
function App() {
return (
<div>
<Routes>
<Route path='/'>
<AllMeetupsPage />
</Route>
<Route path='/new-meets'>
<NewMeetupsPage />
</Route>
<Route path='/favs'>
<FavoritesPage />
</Route>
</Routes>
</div>
);
}
export default App;
然后我得到了這個：
“路線”未定義 react/jsx-no-undef
然后我 ：
試圖從react-router-dom匯入路由- 沒有成功；
嘗試從react-router匯入路由- 沒有成功；
嘗試在不同的組件中也匯入Routes - 沒有成功；
相信我，我為Routes嘗試了所有不同的場景，但無法實作任何不同的效果。一世
谷歌搜索，研究，找不到這個問題的解決方案。
uj5u.com熱心網友回復：
嘗試 import { BrowserRouter as Routes, Route } from react-router-dom
檔案：https : //v5.reactrouter.com/web/guides/quick-start
uj5u.com熱心網友回復：
代替Routes你應該使用Switch
嵌套路由
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
function App() {
return (
<div>
<Router>
<Switch>
<Route path='/'>
<AllMeetupsPage />
</Route>
<Route path='/new-meets'>
<NewMeetupsPage />
</Route>
<Route path='/favs'>
<FavoritesPage />
</Route>
</Switch>
</Router>
</div>
);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/370582.html
標籤：javascript html css 反应