API Documentation / Router

Interface: Router

Router instance.

Properties

currentRoute

• Readonly currentRoute: Ref<RouteLocationNormalizedLoadedGeneric>

Current RouteLocationNormalized

---

listening

• listening: boolean

Allows turning off the listening of history events. This is a low level api for micro-frontend.

---

options

• Readonly options: RouterOptions

Original options object passed to create the Router

Methods

addRoute

▸ addRoute(parentName, route): () => void

Add a new route record as the child of an existing route.

Parameters

Name	Type	Description
parentName	NonNullable<RouteRecordNameGeneric>	Parent Route Record where route should be appended at
route	RouteRecordRaw	Route Record to add

Returns

fn

▸ (): void

Returns

void

▸ addRoute(route): () => void

Add a new route record to the router.

Parameters

Name	Type	Description
route	RouteRecordRaw	Route Record to add

Returns

fn

▸ (): void

Returns

void

---

afterEach

▸ afterEach(guard): () => void

Add a navigation hook that is executed after every navigation. Returns a function that removes the registered hook.

Parameters

Name	Type	Description
guard	NavigationHookAfter	navigation hook to add

Returns

fn

a function that removes the registered hook

▸ (): void

Returns

void

Example

router.afterEach((to, from, failure) => {
  if (isNavigationFailure(failure)) {
    console.log('failed navigation', failure)
  }
})

---

back

▸ back(): void

Go back in history if possible by calling history.back(). Equivalent to router.go(-1).

Returns

void

---

beforeEach

▸ beforeEach(guard): () => void

Add a navigation guard that executes before any navigation. Returns a function that removes the registered guard.

Parameters

Name	Type	Description
guard	NavigationGuardWithThis<undefined>	navigation guard to add

Returns

fn

▸ (): void

Returns

void

---

beforeResolve

▸ beforeResolve(guard): () => void

Add a navigation guard that executes before navigation is about to be resolved. At this state all component have been fetched and other navigation guards have been successful. Returns a function that removes the registered guard.

Parameters

Name	Type	Description
guard	NavigationGuardWithThis<undefined>	navigation guard to add

Returns

fn

a function that removes the registered guard

▸ (): void

Returns

void

Example

router.beforeResolve(to => {
  if (to.meta.requiresAuth && !isAuthenticated) return false
})

---

clearRoutes

▸ clearRoutes(): void

Delete all routes from the router matcher.

Returns

void

---

forward

▸ forward(): void

Go forward in history if possible by calling history.forward(). Equivalent to router.go(1).

Returns

void

---

getRoutes

▸ getRoutes(): RouteRecordNormalized[]

Get a full list of all the route records.

Returns

RouteRecordNormalized[]

---

go

▸ go(delta): void

Allows you to move forward or backward through the history. Calls history.go().

Parameters

Name	Type	Description
delta	number	The position in the history to which you want to move, relative to the current page

Returns

void

---

hasRoute

▸ hasRoute(name): boolean

Checks if a route with a given name exists

Parameters

Name	Type	Description
name	NonNullable<RouteRecordNameGeneric>	Name of the route to check

Returns

boolean

---

install

▸ install(app): void

Called automatically by app.use(router). Should not be called manually by the user. This will trigger the initial navigation when on client side.

Parameters

Name	Type	Description
app	App<any>	Application that uses the router

Returns

void

---

isReady

▸ isReady(): Promise<void>

Returns a Promise that resolves when the router has completed the initial navigation, which means it has resolved all async enter hooks and async components that are associated with the initial route. If the initial navigation already happened, the promise resolves immediately.

This is useful in server-side rendering to ensure consistent output on both the server and the client. Note that on server side, you need to manually push the initial location while on client side, the router automatically picks it up from the URL.

Returns

Promise<void>

---

onError

▸ onError(handler): () => void

Adds an error handler that is called every time a non caught error happens during navigation. This includes errors thrown synchronously and asynchronously, errors returned or passed to next in any navigation guard, and errors occurred when trying to resolve an async component that is required to render a route.

Parameters

Name	Type	Description
handler	_ErrorListener	error handler to register

Returns

fn

▸ (): void

Returns

void

---

push

▸ push(to): Promise<undefined | void | NavigationFailure>

Programmatically navigate to a new URL by pushing an entry in the history stack.

Parameters

Name	Type	Description
to	string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric	Route location to navigate to

Returns

Promise<undefined | void | NavigationFailure>

---

removeRoute

▸ removeRoute(name): void

Remove an existing route by its name.

Parameters

Name	Type	Description
name	NonNullable<RouteRecordNameGeneric>	Name of the route to remove

Returns

void

---

replace

▸ replace(to): Promise<undefined | void | NavigationFailure>

Programmatically navigate to a new URL by replacing the current entry in the history stack.

Parameters

Name	Type	Description
to	string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric	Route location to navigate to

Returns

Promise<undefined | void | NavigationFailure>

---

resolve

▸ resolve<Name>(to, currentLocation?): RouteLocationResolvedGeneric

Returns the normalized version of a route location. Also includes an href property that includes any existing base. By default, the currentLocation used is router.currentRoute and should only be overridden in advanced use cases.

Type parameters

Name	Type
Name	extends string | symbol = string | symbol

Parameters

Name	Type	Description
to	RouteLocationAsRelativeTyped<RouteMapGeneric, Name>	Raw route location to resolve
currentLocation?	RouteLocationNormalizedLoadedGeneric	Optional current location to resolve against

Returns

RouteLocationResolvedGeneric

▸ resolve(to, currentLocation?): RouteLocationResolvedGeneric

Parameters

Name	Type
to	string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric
currentLocation?	RouteLocationNormalizedLoadedGeneric

Returns

RouteLocationResolvedGeneric