Outlet
Outlet
组件是用来在父路由组件中标定其嵌套子路由组件的渲染位置的。Outlet
组件的使用非常简单,只需要书写到父路由组件中所需要的位置即可,不需要其他任何属性配置。
以下是一个Outlet
组件的使用示例。
function FuncLayout() {
return (
<div>
<h1>Main Functions</h1>
<Outlet />
<ul>
<li>
<Link to="/func/1">Function 1</Link>
</li>
</ul>
</div>
);
}
function App() {
return (
<Routes>
<Route path="/func" element={<FuncLayout />}>
<Route path=":id" element={<FuncItem />} />
</Route>
</Routes>
);
}
Outlet
组件目前不支持接受任何属性,所以只需要在需要渲染嵌套子路由的位置放置这个组件就可以了。