Outlet 如何使用-React Router
<Outlet>
用于渲染父路由中渲染子路由。如果父路由被严格匹配,会渲染子路由中的 index 路由(如有)。
类型定义如下:
interface OutletProps {
context?: unknown;
}
declare function Outlet(
props: OutletProps
): React.ReactElement | null;
示例:
import { Outlet } from 'umi';
function Dashboard() {
return (
<div>
<h1>Dashboard</h1>
<Outlet />
</div>
);
}
function DashboardWithContext() {
return (
<div>
<h1>Dashboard</h1>
<Outlet context={{ prop: 'a' }}/>
</div>
);
}
Outlet
组件的 context
可以使用 API useOutletContext
在子组件中获取。