Function useRouteLoaderData

Returns the loader data for a given route by route ID.

import { useRouteLoaderData } from "react-router";

function SomeComponent() {
  const { user } = useRouteLoaderData("root");
}
Copy

Route IDs are created automatically. They are simply the path of the route file relative to the app folder without the extension.

Route Filename	Route ID
app/root.tsx	"root"
app/routes/teams.tsx	"routes/teams"
app/whatever/teams.$id.tsx	"whatever/teams.$id"

If you created an ID manually, you can use that instead:

route("/", "containers/app.tsx", { id: "app" }})
Copy