`<Outlet>`

類型宣告

interface OutletProps {
  context?: unknown;
}
declare function Outlet(
  props: OutletProps
): React.ReactElement | null;

當父代路由元素用於渲染其子代路由元素時，應使用 <Outlet>。這樣一來，當子代路由渲染時，就會顯示巢狀 UI。如果父代路由完全符合，它將渲染子代索引路由，或者如果沒有索引路由則不渲染任何內容。

function Dashboard() {
  return (
    <div>
      <h1>Dashboard</h1>

      {/* This element will render either <DashboardMessages> when the URL is
          "/messages", <DashboardTasks> at "/tasks", or null if it is "/"
      */}
      <Outlet />
    </div>
  );
}

function App() {
  return (
    <Routes>
      <Route path="/" element={<Dashboard />}>
        <Route
          path="messages"
          element={<DashboardMessages />}
        />
        <Route path="tasks" element={<DashboardTasks />} />
      </Route>
    </Routes>
  );
}