### active-class
- type: `string`
-- default: `"router-link-active"` (or global [`routerLinkActiveClass`](#TODO))
+- default: `"router-link-active"` (or global [`linkActiveClass`](#linkactiveclass))
Class to apply on the rendered `a` when the link is active.
### exact-active-class
- type: `string`
-- default: `"router-link-exact-active"` (or global [`routerLinkExactActiveClass`](#TODO))
+- default: `"router-link-exact-active"` (or global [`linkExactActiveClass`](#linkexactactiveclass))
Class to apply when the link is exact active.
`<router-link>` exposes a low level customization through a [scoped slot](https://v3.vuejs.org/guide/component-slots.html#scoped-slots). This is a more advanced API that primarily targets library authors but can come in handy for developers as well, to build a custom component like a _NavLink_ or other.
-\*\*Remember to pass the `custom` option to `<router-link>` to prevent it from wrapping its content inside of an `<a>` element.
+:::tip
+Remember to pass the `custom` option to `<router-link>` to prevent it from wrapping its content inside of an `<a>` element.
+:::
```html
<router-link
```html
<router-link
to="/foo"
+ custom
v-slot="{ href, route, navigate, isActive, isExactActive }"
>
<li
## createRouter
-Creates a Router instance that can be used by a Vue app.
+Creates a Router instance that can be used by a Vue app. Check the [RouterOptions](#routeroptions) for a list of all the properties that can be passed.
**Signature:**
### Parameters
-| Parameter | Type | Description |
-| --------- | ------------------------------------------------------- | -------------------------------- |
-| options | [`RouterOptions`](./vue-router-interface#routeroptions) | Options to initialize the router |
+| Parameter | Type | Description |
+| --------- | ------------------------------- | -------------------------------- |
+| options | [RouterOptions](#routeroptions) | Options to initialize the router |
+
+## RouterOptions
+
+### history
+
+History implementation used by the router. Most web applications should use `createWebHistory` but it requires the server to be properly configured. You can also use a _hash_ based history with `createWebHashHistory` that does not require any configuration on the server but isn't handled at all by search engines and does poorly on SEO.
+
+**Signature:**
+
+```typescript
+history: RouterHistory
+```
+
+#### Examples
+
+```js
+createRouter({
+ history: createWebHistory(),
+ // other options...
+})
+```
+
+### linkActiveClass
+
+Default class applied to active [RouterLink](#router-link-props). If none is provided, `router-link-active` will be applied.
+
+**Signature:**
+
+```typescript
+linkActiveClass?: string;
+```
+
+### linkExactActiveClass
+
+Default class applied to exact active [RouterLink](#router-link-props). If none is provided, `router-link-exact-active` will be applied.
+
+**Signature:**
+
+```typescript
+linkExactActiveClass?: string;
+```
+
+### parseQuery
+
+Custom implementation to parse a query. See its counterpart, [stringifyQuery](#stringifyquery).
+
+**Signature:**
+
+```typescript
+parseQuery?: typeof originalParseQuery;
+```
+
+#### Examples
+
+Let's say you want to use the package [qs](https://github.com/ljharb/qs) to parse queries, you can provide both `parseQuery` and `stringifyQuery`:
+
+```js
+import qs from 'qs'
+
+createRouter({
+ // other options...
+ parse: qs.parse,
+ stringifyQuery: qs.stringify,
+})
+```
+
+### routes
+
+Initial list of routes that should be added to the router.
+
+**Signature:**
+
+```typescript
+routes: RouteRecordRaw[];
+```
+
+### scrollBehavior
+
+Function to control scrolling when navigating between pages. Can return a Promise to delay scrolling. Check .
+
+**Signature:**
+
+```typescript
+scrollBehavior?: ScrollBehavior;
+```
+
+#### Examples
+
+```js
+function scrollBehavior(to, from, savedPosition) {
+ // `to` and `from` are both route locations
+ // `savedPosition` can be null if there isn't one
+}
+```
+
+### stringifyQuery
+
+Custom implementation to stringify a query object. Should not prepend a leading `?`. [parseQuery](#parsequery) counterpart to handle query parsing.
+
+**Signature:**
+
+```typescript
+stringifyQuery?: typeof originalStringifyQuery;
+```
## createWebHistory
## createMemoryHistory
-Creates a in-memory based history. The main purpose of this history is to handle SSR. It starts in a special location that is nowhere. It's up to the user to replace that location with the starter location.
+Creates a in-memory based history. The main purpose of this history is to handle SSR. It starts in a special location that is nowhere. It's up to the user to replace that location with the starter location by either calling `router.push` or `router.replace`.
**Signature:**
### Parameters
-| Parameter | Type | Description |
-| --------- | ------ | ----------------------------------------- |
-| base | string | Base applied to all urls, defaults to '/' |
+| Parameter | Type | Description |
+| --------- | -------- | ----------------------------------------- |
+| base | `string` | Base applied to all urls, defaults to '/' |
### Returns
a history object that can be passed to the router constructor
+
+## NavigationFailureType
+
+Enumeration with all possible types for navigation failures. Can be passed to [isNavigationFailure](#isnavigationfailure) to check for specific failures. **Never use any of the numerical values**, always use the variables like `NavigationFailureType.aborted`.
+
+**Signature:**
+
+```typescript
+export declare enum NavigationFailureType
+```
+
+### Members
+
+| Member | Value | Description |
+| ---------- | ----- | -------------------------------------------------------------------------------------------------------------------------------- |
+| aborted | 4 | An aborted navigation is a navigation that failed because a navigation guard returned `false` or called `next(false)` |
+| cancelled | 8 | A cancelled navigation is a navigation that failed because a more recent navigation finished started (not necessarily finished). |
+| duplicated | 16 | A duplicated navigation is a navigation that failed because it was initiated while already being at the exact same location. |
+
+## Composition API
+
+### onBeforeRouteLeave
+
+Add a navigation guard that triggers whenever the component for the current location is about to be left. Similar to but can be used in any component. The guard is removed when the component is unmounted.
+
+**Signature:**
+
+```typescript
+export declare function onBeforeRouteLeave(leaveGuard: NavigationGuard): void
+```
+
+#### Parameters
+
+| Parameter | Type | Description |
+| ---------- | --------------- | ----------------------------------- |
+| leaveGuard | NavigationGuard | [NavigationGuard](#navigationguard) |
+
+### onBeforeRouteUpdate
+
+Add a navigation guard that triggers whenever the current location is about to be updated. Similar to but can be used in any component. The guard is removed when the component is unmounted.
+
+**Signature:**
+
+```typescript
+export declare function onBeforeRouteUpdate(updateGuard: NavigationGuard): void
+```
+
+#### Parameters
+
+| Parameter | Type | Description |
+| ----------- | --------------- | ----------------------------------- |
+| updateGuard | NavigationGuard | [NavigationGuard](#navigationguard) |
+
+### useLink
+
+TODO:
+
+### useRoute
+
+TODO:
+
+### useRouter
+
+TODO:
+
+## TypeScript
+
+Here are some of the interfaces and types used by Vue Router. The documentation references them to give you an idea of the existing properties in objects.
redirect: _RouteRecordBase['redirect'] | undefined
```
-## RouterOptions
-
-### Methods
-
-### Properties
-
-#### history
-
-History implementation used by the router. Most web applications should use `createWebHistory` but it requires the server to be properly configured. You can also use a _hash_ based history with `createWebHashHistory` that does not require any configuration on the server but isn't handled at all by search engines and does poorly on SEO.
-
-**Signature:**
-
-```typescript
-history: RouterHistory
-```
-
-### Examples
-
-```js
-createRouter({
- history: createWebHistory(),
- // other options...
-})
-```
-
-#### linkActiveClass
-
-Default class applied to active [RouterLink](./vue-router-variable#routerlink). If none is provided, `router-link-active` will be applied.
-
-**Signature:**
-
-```typescript
-linkActiveClass?: string;
-```
-
-#### linkExactActiveClass
-
-Default class applied to exact active [RouterLink](./vue-router-variable#routerlink). If none is provided, `router-link-exact-active` will be applied.
-
-**Signature:**
-
-```typescript
-linkExactActiveClass?: string;
-```
-
-#### parseQuery
-
-Custom implementation to parse a query. See its counterpart, [stringifyQuery](./vue-router-interface#routeroptions.stringifyquery).
-
-**Signature:**
-
-```typescript
-parseQuery?: typeof originalParseQuery;
-```
-
-### Examples
-
-Let's say you want to use the package [qs](https://github.com/ljharb/qs) to parse queries, you can provide both `parseQuery` and `stringifyQuery`:
-
-```js
-import qs from 'qs'
-
-createRouter({
- // other options...
- parse: qs.parse,
- stringifyQuery: qs.stringify,
-})
-```
-
-#### routes
-
-Initial list of routes that should be added to the router.
-
-**Signature:**
-
-```typescript
-routes: RouteRecordRaw[];
-```
-
-#### scrollBehavior
-
-Function to control scrolling when navigating between pages. Can return a Promise to delay scrolling. Check .
-
-**Signature:**
-
-```typescript
-scrollBehavior?: ScrollBehavior;
-```
-
-### Examples
-
-```js
-function scrollBehavior(to, from, savedPosition) {
- // `to` and `from` are both route locations
- // `savedPosition` can be null if there isn't one
-}
-```
-
-#### stringifyQuery
-
-Custom implementation to stringify a query object. Should not prepend a leading `?`. [parseQuery](./vue-router-interface#routeroptions.parsequery) counterpart to handle query parsing.
-
-**Signature:**
-
-```typescript
-stringifyQuery?: typeof originalStringifyQuery;
-```
-
### Methods
### Properties
projects / thirdparty / vuejs / router.git / commitdiff
