useResolvedPath

Framework Data Declarative

Summary

Resolves the pathname of the given to value against the current Location. Similar to useHref, but returns a Path instead of a string.

import { useResolvedPath } from "react-router";

function SomeComponent() {
  // if the user is at /dashboard/profile
  let path = useResolvedPath("../accounts");
  path.pathname; // "/dashboard/accounts"
  path.search; // ""
  path.hash; // ""
}

Signature

function useResolvedPath(
  to: To,
  {
    relative,
  }: {
    relative?: RelativeRoutingType;
  } = {},
): Path

Params

to

The path to resolve

options.relative

Defaults to "route" so routing is relative to the route tree. Set to "path" to make relative routing operate against path segments.

Returns

The resolved Path object with pathname, search, and hash