React Corsair - v0.0.10
    Preparing search index...

    Interface RouteOptions<Params, Data, Context>

    Options of a Route.

    interface RouteOptions<Params extends Dict, Data, Context> {
        component?: ComponentType;
        dataLoader?: (
            options: DataLoaderOptions<Params, Context>,
        ) => Data | PromiseLike<Data>;
        errorComponent?: ComponentType;
        isCaseSensitive?: boolean;
        lazyComponent?: () => PromiseLike<ComponentModule>;
        loadingAppearance?: LoadingAppearance;
        loadingComponent?: ComponentType;
        notFoundComponent?: ComponentType;
        paramsAdapter?: ParamsAdapter<Params> | ((params: Dict) => Params);
        pathname?: string;
        renderingDisposition?: RenderingDisposition;
    }

    Type Parameters

    • Params extends Dict

      Route params.

    • Data

      Data loaded by a route.

    • Context

      A router context.

    Index

    Properties

    component?: ComponentType

    A component that is rendered by a route.

    If both component and lazyComponent are omitted then a route implicitly renders an Outlet.

    dataLoader?: (
        options: DataLoaderOptions<Params, Context>,
    ) => Data | PromiseLike<Data>

    A callback that loads data required to render a route.

    Loaded data is available in route component via useRoute().data.

    Type declaration

    errorComponent?: ComponentType

    A component that is rendered when an error was thrown during route rendering.

    Routes without an errorComponent don't have an error boundary.

    isCaseSensitive?: boolean

    If true then pathname is matched in a case-sensitive manner.

    false
    
    lazyComponent?: () => PromiseLike<ComponentModule>

    A lazy-loaded component that is rendered by a route. A component cached forever if a returned Promise is fulfilled.

    () => import('./UserPage')
    
    loadingAppearance?: LoadingAppearance

    What to render when lazyComponent or dataLoader are being loaded.

    If not specified then RouterOptions.loadingAppearance is used instead.

    loadingComponent?: ComponentType

    A component that is rendered when a lazyComponent or a dataLoader are being loaded. Render a skeleton or a spinner in this component to notify user that a new route is being loaded.

    Routes without a loadingComponent suspend a parent route.

    notFoundComponent?: ComponentType

    A component that is rendered if notFound was called during route loading or rendering or if there's no route that matches the location a router was navigated to.

    Routes without notFoundComponent propagate notFound to a parent route.

    paramsAdapter?: ParamsAdapter<Params> | ((params: Dict) => Params)

    An adapter that can validate and transform params extracted from the Location.pathname and Location.searchParams.

    Params are available in route all components via useRoute().params.

    Type declaration

    pathname?: string

    A URL pathname pattern.

    Pattern can include params that conform :[A-Za-z$_][A-Za-z0-9$_]+. For example "/:userId".

    Params match a whole segment and cannot be partial. For example, "/teams--:teamId" is invalid and would throw a SyntaxError, while "/teams/:teamId" is valid.

    By default, a param matches a non-empty pathname segment. To make a param optional (so it can match an absent segment) follow it by a ? flag. For example: "/user/:userId?" matches both "/user" and "/user/37".

    Static pathname segments can be optional as well: "/project/task?/:taskId".

    By default, a param matches a single pathname segment. Follow a param with a * flag to make it match multiple segments. For example: "/:slug*" matches "/watch" and "/watch/a/movie". Such params are called wildcard params.

    To make param both wildcard and optional, combine * and ? flags: "/:slug*?".

    To use : as a character in a pathname pattern, replace it with an encoded representation: %3A.

    "/"
    
    renderingDisposition?: RenderingDisposition

    Where the route is rendered.

    If not specified then RouterOptions.renderingDisposition is used instead.