@gluonjs/router / packages/router/src / RouteLocationPath

Interface: RouteLocationPath

Properties

hash?

readonly optional hash?: string

path

readonly path: string

query?

readonly optional query?: Readonly<Record<string, LocationQueryValue>>

state?

readonly optional state?: Readonly<Record<string, unknown>>

Example

Build a path-based navigation target with structured query, hash, and history state rather than concatenating a URL manually:

import {
  NavigationFailureType,
  createMemoryHistory,
  createRouter,
  isNavigationFailure,
  type AfterNavigationHook,
  type NavigationFailure,
  type NavigationFailureTypeValue,
  type NavigationGuard,
  type NavigationGuardReturn,
  type RouteLocationNormalized,
  type RouteLocationPath,
  type RouteLocationRaw,
  type Router,
  type RouterSnapshot,
  type ScrollBehavior,
} from '@gluonjs/router';

const target = { path: '/checkout', query: { step: 2 } } satisfies RouteLocationPath;
const rawTarget: RouteLocationRaw = target;
const guardResult: NavigationGuardReturn = true;
const requireCart: NavigationGuard = (to: RouteLocationNormalized) =>
  to.path === '/checkout' ? guardResult : true;
const restoreScroll: ScrollBehavior = (_to, _from, savedPosition) =>
  savedPosition ?? { left: 0, top: 0 };
const afterEach: AfterNavigationHook = (to, from, failure?: NavigationFailure) =>
  console.log(`${from.fullPath} -> ${to.fullPath}`, failure?.message);

const router: Router = createRouter({
  history: createMemoryHistory(['/shop']),
  routes: [{ path: '/shop' }, { path: '/checkout' }],
  scrollBehavior: restoreScroll,
});
const stopGuard = router.beforeEach(requireCart);
const stopAfter = router.afterEach(afterEach);
const failure = await router.push(rawTarget);
const failureType: NavigationFailureTypeValue = NavigationFailureType.aborted;
if (isNavigationFailure(failure, failureType)) console.warn(failure.to.fullPath);
const snapshot: RouterSnapshot = router.dehydrate();
console.log(snapshot.location, router.currentRoute.value.fullPath);
stopGuard();
stopAfter();
router.destroy();