Skip to content

NavigationGuard ​

The route guard type. beforeEach / beforeResolve / beforeEnter all use this signature.

ts
type NavigationGuard = (
	to: RouteLocation,
	from: RouteLocation
) => any

Why the return type is any

A guard's valid return values form a multi-type union (boolean / string / location object / NavigationRedirect / Error / null). Under the non-vapor (Kotlin / Swift) compilation modes, union types mismatch function variance (e.g. Boolean? cannot be assigned to the Any generated by a union type), so the signature is loosened to any. The actually allowed return values are listed in NavigationGuardReturn.

The formal union type of a guard's return value:

ts
type NavigationGuardReturn =
	| boolean
	| string
	| RawLocationLike
	| NavigationRedirect
	| Error
	| null

UTS has no undefined; null means "no return / allow". The behavior of each return value:

ReturnBehavior
null / trueAllow
falseAbort the navigation (ABORTED)
ErrorAbort the navigation and serve as the failure reason (CANCELLED)
stringRedirect to that path
RawLocationLikeRedirect to that location (keeps the original navigation mode)
NavigationRedirectRedirect to location, optionally specifying the navigation mode mode

In-component guards (onBeforeRouteEnter / onBeforeRouteUpdate / onBeforeRouteLeave) return NavigationGuardReturn | Promise<NavigationGuardReturn>.

A navigation redirect instruction (a guard returns this object to redirect to another route):

ts
type NavigationRedirect = {
	/** Redirect target location (a string path or a location object) */
	location: RouteLocationRaw
	/** Navigation mode: 'push' | 'replace' | 'relaunch'; omitted means keep the original navigation mode */
	mode?: NavigationRedirectMode
}

A redirect re-runs the full guard chain with a depth limit of 10; exceeding it is cancelled with CANCELLED.

RawLocationLike ​

The object location form a guard may return (a plain location object, distinct from a NavigationRedirect carrying a location field):

ts
type RawLocationLike = {
	path?: string
	name?: string
	query?: Map<string, string>
	params?: Map<string, string>
}

PostNavigationGuard ​

The after guard type used by afterEach, which may receive failure information (UTS function parameters cannot be optional, so it uses an explicitly nullable failure):

ts
type PostNavigationGuard = (
	to: RouteLocation,
	from: RouteLocation,
	failure: Error | null
) => void

On a successful navigation failure is null; on abort / failure it carries the corresponding Error.

In-component Guard Types ​

The three in-component guards share the same signature, differing only in usage scenario:

ts
type BeforeRouteEnterGuard = (
	to: RouteLocation,
	from: RouteLocation
) => NavigationGuardReturn | Promise<NavigationGuardReturn>

type BeforeRouteUpdateGuard = (
	to: RouteLocation,
	from: RouteLocation
) => NavigationGuardReturn | Promise<NavigationGuardReturn>

type BeforeRouteLeaveGuard = (
	to: RouteLocation,
	from: RouteLocation
) => NavigationGuardReturn | Promise<NavigationGuardReturn>

In-component guards are implemented as a filter on the global beforeResolve and registered in a page's setup.

Released under the MIT License.