useRouteLoaderData

Framework Data

Summary

Reference Documentation ↗

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

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

import { useRouteLoaderData } from "react-router";

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

// You can also specify your own route ID's manually in your routes.ts file:
route("/", "containers/app.tsx", { id: "app" })
useRouteLoaderData("app");

Signature

function useRouteLoaderData<T = any>(
  routeId: string,
): SerializeFrom<T> | undefined

Params

routeId

The ID of the route to return loader data from

Returns

The data returned from the specified route's loader function, or undefined if not found