這個問題在這里已經有了答案： 錯誤：[Header] 不是 <Route> 組件 1 個回答 9 小時前關閉。
我有一個社交媒體應用程式，我的 App.js 看起來像這樣：
<div className="App">
<Router>
{!name ? (
<>
<Login />
</>
) : (
<Routes>
<Route exact path="/">
<Header />
<Feed />
<Model />
</Route>
<Route exact path="">
<Navigate to="/" />
</Route>
</Routes>
)}
</Router>
</div>
因此，如果用戶被授權，它會將我們重定向到主頁，但如果他們未經授權，我們就會有一個登錄頁面。
但是我在控制臺中有下一個錯誤：
Uncaught Error: [Header] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>
是什么導致了這個錯誤？
uj5u.com熱心網友回復：
在 react-router 的第 6 版中，您應該使用elementprop 來告訴它要渲染什么：
<Route path="/" element={(
<>
<Header />
<Feed />
<Model />
</>
)}/>
將子級添加到路由是為定義嵌套路由而保留的，如下所示：
<Routes>
<Route path="/" element={<Home />} />
<Route path="users" element={<Users />}>
<Route path="/" element={<UsersIndex />} />
<Route path=":id" element={<UserProfile />} />
</Route>
</Routes>
uj5u.com熱心網友回復：
如果您使用的是舊版本的 react-router-dom：
<Route exact path="/" component={(
<React.Fragment>
<Header />
<Feed />
<Model />
</React.Fragment>
)} />
如果您使用的是 V6，請將component道具的名稱替換為即可element。
Route從 V6 開始，或的所有子級Routes必須是Route. 例如，如果您有一條路線path="/home"并且您有路線/home/abc，那么該路線/abc應該/home作為其Route組件的子項進入路線內部。
我不完全理解他們為什么選擇這種方式，但是嘿，社區并不重要，對吧？:)
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/479170.html
標籤：javascript 反应 反应路由器