@gluonjs/router / packages/router/src / RouterSnapshot
Interface: RouterSnapshot
Properties
location
readonlylocation:string
Example
Serialize the current Router location so SSR or another owner can restore the same route deterministically:
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();