You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Route record that can be provided by the user when adding routes via the [`routes` option](#routeroptions) or via [`router.addRoutes()`](#addroutes). There are three different kind of route records:
772
772
773
773
- Single views records: have a `component` option
774
-
- Multiple views records ([named views](/guide/essentials/named-views.md)): have a `components` option
774
+
- Multiple views records ([named views](../guide/essentials/named-views.md)): have a `components` option
775
775
- Redirect records: cannot have `component` or `components` option because a redirect record is never reached.
776
776
777
777
### path
@@ -782,7 +782,7 @@ Route record that can be provided by the user when adding routes via the [`route
782
782
Path of the record. Should start with `/` unless the record is the child of another record.
783
783
Can define parameters: `/users/:id` matches `/users/1` as well as `/users/posva`.
@@ -834,7 +834,7 @@ Route record that can be provided by the user when adding routes via the [`route
834
834
Allows passing down params as props to the component rendered by `router-view`. When passed to a _multiple views record_, it should be an object with the same keys as `components` or a `boolean` to be applied to each component.
835
835
target location.
836
836
837
-
-**See Also**: [Passing props to Route Components](/guide/essentials/passing-props.md)
837
+
-**See Also**: [Passing props to Route Components](../guide/essentials/passing-props.md)
838
838
839
839
### meta
840
840
@@ -843,7 +843,7 @@ Route record that can be provided by the user when adding routes via the [`route
@@ -918,7 +918,7 @@ Normalized version of a [Route Record](#routerecordraw)
918
918
919
919
## RouteLocationRaw
920
920
921
-
User-level route location that can be passed to `router.push()`, `redirect`, and returned in [Navigation Guards](/guide/advanced/navigation-guards.md).
921
+
User-level route location that can be passed to `router.push()`, `redirect`, and returned in [Navigation Guards](../guide/advanced/navigation-guards.md).
922
922
923
923
A raw location can either be a `string` like `/users/posva#bio` or an object:
924
924
@@ -988,7 +988,7 @@ Normalized route location. Does not have any [redirect records](#routerecordraw)
988
988
989
989
Arbitrary data attached to all matched records merged (non recursively) from parent to child.
@@ -1060,7 +1060,7 @@ Normalized route location. Does not have any [redirect records](#routerecordraw)
1060
1060
-[`RouteLocationRaw`](#routelocationraw): redirects to a different location
1061
1061
-`(vm: ComponentPublicInstance) => any`**only for `beforeRouteEnter`**: A callback to be executed once the navigation completes. Receives the route component instance as the parameter.
Copy file name to clipboardExpand all lines: docs/guide/advanced/composition-api.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -84,7 +84,7 @@ Composition API guards can also be used in any component rendered by `<router-vi
84
84
85
85
## `useLink`
86
86
87
-
Vue Router exposes the internal behavior of RouterLink as a Composition API function. It gives access the same properties as the [`v-slot` API](/api/#router-link-s-v-slot):
87
+
Vue Router exposes the internal behavior of RouterLink as a Composition API function. It gives access the same properties as the [`v-slot` API](../../api/#router-link-s-v-slot):
Copy file name to clipboardExpand all lines: docs/guide/advanced/dynamic-routing.md
+3-3
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
# Dynamic Routing
2
2
3
-
Adding routes to your router is usually done via the [`routes` option](/api/#routes) but in some situations, you might want to add or remove routes while the application is already running. Application with extensible interfaces like [Vue CLI UI](https://cli.vuejs.org/dev-guide/ui-api.html) can use this to make the application grow.
3
+
Adding routes to your router is usually done via the [`routes` option](../../api/#routes) but in some situations, you might want to add or remove routes while the application is already running. Application with extensible interfaces like [Vue CLI UI](https://cli.vuejs.org/dev-guide/ui-api.html) can use this to make the application grow.
4
4
5
5
## Adding Routes
6
6
@@ -99,5 +99,5 @@ router.addRoute({
99
99
100
100
Vue Router gives you two functions to look at existing routes:
101
101
102
-
-[`router.hasRoute()`](/api/#hasroute): check if a route exists
103
-
-[`router.getRoutes()`](/api/#getroutes): get an array with all the route records.
102
+
-[`router.hasRoute()`](../../api/#hasroute): check if a route exists
103
+
-[`router.getRoutes()`](../../api/#getroutes): get an array with all the route records.
Copy file name to clipboardExpand all lines: docs/guide/advanced/navigation-guards.md
+4-4
Original file line number
Diff line number
Diff line change
@@ -20,15 +20,15 @@ Global before guards are called in creation order, whenever a navigation is trig
20
20
21
21
Every guard function receives two arguments:
22
22
23
-
-**`to`**: the target route location [in a normalized format](/api/#routelocationnormalized) being navigated to.
24
-
-**`from`**: the current route location [in a normalized format](/api/#routelocationnormalized) being navigated away from.
23
+
-**`to`**: the target route location [in a normalized format](../../api/#routelocationnormalized) being navigated to.
24
+
-**`from`**: the current route location [in a normalized format](../../api/#routelocationnormalized) being navigated away from.
25
25
26
26
And can optionally return any of the following values:
27
27
28
28
-`false`: cancel the current navigation. If the browser URL was changed (either manually by the user or via back button), it will be reset to that of the `from` route.
29
-
- A [Route Location](/api/#routelocationraw): Redirect to a different location by passing a route location as if you were calling [`router.push()`](/api/#push), which allows you to pass options like `replace: true` or `name: 'home'`. The current navigation is dropped and a new one is created with the same `from`.
29
+
- A [Route Location](../../api/#routelocationraw): Redirect to a different location by passing a route location as if you were calling [`router.push()`](../../api/#push), which allows you to pass options like `replace: true` or `name: 'home'`. The current navigation is dropped and a new one is created with the same `from`.
30
30
31
-
It's also possible to throw an `Error` if an unexpected situation was met. This will also cancel the navigation and call any callback registered via [`router.onError()`](/api/#onerror).
31
+
It's also possible to throw an `Error` if an unexpected situation was met. This will also cancel the navigation and call any callback registered via [`router.onError()`](../../api/#onerror).
32
32
33
33
If nothing, `undefined` or `true` is returned, **the navigation is validated**, and the next navigation guard is called.
In addition to `$route.params`, the `$route` object also exposes other useful information such as `$route.query` (if there is a query in the URL), `$route.hash`, etc. You can check out the full details in the [API Reference](/api/#routelocationnormalized).
34
+
In addition to `$route.params`, the `$route` object also exposes other useful information such as `$route.query` (if there is a query in the URL), `$route.hash`, etc. You can check out the full details in the [API Reference](../../api/#routelocationnormalized).
35
35
36
36
A working demo of this example can be found [here](https://codesandbox.io/s/route-params-vue-router-examples-mlb14?from-embed&initialpath=%2Fusers%2Feduardo%2Fposts%2F1).
37
37
@@ -88,7 +88,7 @@ const routes = [
88
88
]
89
89
```
90
90
91
-
In this specific scenario we are using a [custom regexp](/guide/essentials/route-matching-syntax.md#custom-regexp-in-params) between parentheses and marking the `pathMatch` param as [optionally repeatable](/guide/essentials/route-matching-syntax.md#optional-parameters). This allows us to directly navigate to the route if we need to by splitting the `path` into an array:
91
+
In this specific scenario we are using a [custom regexp](./route-matching-syntax.md#custom-regexp-in-params) between parentheses and marking the `pathMatch` param as [optionally repeatable](./route-matching-syntax.md#optional-parameters). This allows us to directly navigate to the route if we need to by splitting the `path` into an array:
92
92
93
93
```js
94
94
this.$router.push({
@@ -101,7 +101,7 @@ this.$router.push({
101
101
})
102
102
```
103
103
104
-
See more in the [repeated params](/guide/essentials/route-matching-syntax.md#repeatable-params) section.
104
+
See more in the [repeated params](./route-matching-syntax.md#repeatable-params) section.
105
105
106
106
If you are using [History mode](./history-mode.md), make sure to follow the instructions to correctly configure your server as well.
Copy file name to clipboardExpand all lines: docs/guide/essentials/history-mode.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -42,7 +42,7 @@ Not to worry: To fix the issue, all you need to do is add a simple catch-all fal
42
42
43
43
## Example Server Configurations
44
44
45
-
**Note**: The following examples assume you are serving your app from the root folder. If you deploy to a subfolder, you should use [the `publicPath` option of Vue CLI](https://cli.vuejs.org/config/#publicpath) and the related [`base` property of the router](/api/#createwebhistory). You also need to adjust the examples below to use the subfolder instead of the root folder (e.g. replacing `RewriteBase /` with `RewriteBase /name-of-your-subfolder/`).
45
+
**Note**: The following examples assume you are serving your app from the root folder. If you deploy to a subfolder, you should use [the `publicPath` option of Vue CLI](https://cli.vuejs.org/config/#publicpath) and the related [`base` property of the router](../../api/#createwebhistory). You also need to adjust the examples below to use the subfolder instead of the root folder (e.g. replacing `RewriteBase /` with `RewriteBase /name-of-your-subfolder/`).
Since the prop `to` accepts the same kind of object as `router.push`, the exact same rules apply to both of them.
55
55
56
-
`router.push` and all the other navigation methods return a _Promise_ that allows us to wait til the navigation is finished and to know if it succeeded or failed. We will talk more about that in [Navigation Handling](../advanced/navigation-handling.md).
56
+
`router.push` and all the other navigation methods return a _Promise_ that allows us to wait til the navigation is finished and to know if it succeeded or failed. We will talk more about that in [Navigation Handling](../advanced/navigation-failures.md).
57
57
58
58
## Replace current location
59
59
@@ -98,4 +98,4 @@ You may have noticed that `router.push`, `router.replace` and `router.go` are co
98
98
99
99
Therefore, if you are already familiar with [Browser History APIs](https://developer.mozilla.org/en-US/docs/Web/API/History_API), manipulating history will feel familiar when using Vue Router.
100
100
101
-
It is worth mentioning that Vue Router navigation methods (`push`, `replace`, `go`) work consistently no matter the kind of [`history` option](/api/#history) is passed when creating the router instance.
101
+
It is worth mentioning that Vue Router navigation methods (`push`, `replace`, `go`) work consistently no matter the kind of [`history` option](../../api/#history) is passed when creating the router instance.
Copy file name to clipboardExpand all lines: docs/guide/index.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -90,6 +90,6 @@ export default {
90
90
}
91
91
```
92
92
93
-
To access the router or the route inside the `setup` function, call the `useRouter` or `useRoute` functions. We will learn more about this in [the Composition API](/guide/advanced/composition-api.md#accessing-the-router-and-current-route-inside-setup)
93
+
To access the router or the route inside the `setup` function, call the `useRouter` or `useRoute` functions. We will learn more about this in [the Composition API](./advanced/composition-api.md#accessing-the-router-and-current-route-inside-setup)
94
94
95
95
Throughout the docs, we will often use the `router` instance. Keep in mind that `this.$router` is exactly the same as directly using the `router` instance created through `createRouter`. The reason we use `this.$router` is because we don't want to import the router in every single component that needs to manipulate routing.
### Removal of `event` and `tag` props in `<router-link>`
165
165
166
-
Both `event`, and `tag` props have been removed from `<router-link>`. You can use the [`v-slot` API](/api/#router-link-s-v-slot) to fully customize `<router-link>`:
166
+
Both `event`, and `tag` props have been removed from `<router-link>`. You can use the [`v-slot` API](../../api/#router-link-s-v-slot) to fully customize `<router-link>`:
167
167
168
168
```html
169
169
replace
@@ -193,7 +193,7 @@ At the moment navigation guards in mixins are not supported. You can track its s
193
193
194
194
### Removal of `router.match` and changes to `router.resolve`
195
195
196
-
Both `router.match`, and `router.resolve` have been merged together into `router.resolve` with a slightly different signature. [Refer to the API](/api/#resolve) for more details.
196
+
Both `router.match`, and `router.resolve` have been merged together into `router.resolve` with a slightly different signature. [Refer to the API](../../api/#resolve) for more details.
197
197
198
198
**Reason**: Uniting multiple methods that were used for the same purpose.
Note this will work if `path` was `/parent/` as the relative location `home` to `/parent/` is indeed `/parent/home` but the relative location of `home` to `/parent` is `/home`.
386
390
387
-
<!-- Learn more about relative links [in the cookbook](/cookbook/relative-links.md). -->
391
+
<!-- Learn more about relative links [in the cookbook](../../cookbook/relative-links.md). -->
388
392
389
393
**Reason**: This is to make trailing slash behavior consistent: by default all routes allow a trailing slash. It can be disabled by using the `strict` option and manually appending (or not) a slash to the routes.
390
394
@@ -394,10 +398,10 @@ Note this will work if `path` was `/parent/` as the relative location `home` to
394
398
395
399
Decoded values in `params`, `query`, and `hash` are now consistent no matter where the navigation is initiated (older browsers will still produce unencoded `path` and `fullPath`). The initial navigation should yield the same results as in-app navigations.
396
400
397
-
Given any [normalized route location](/api/#routelocationnormalized):
401
+
Given any [normalized route location](../../api/#routelocationnormalized):
398
402
399
403
- Values in `path`, `fullPath` are not decoded anymore. They will appear as provided by the browser (most browsers provide them encoded). e.g. directly writing on the address bar `https://example.com/hello world` will yield the encoded version: `https://example.com/hello%20world` and both `path` and `fullPath` will be `/hello%20world`.
400
-
-`hash` is now decoded, that way it can be copied over: `router.push({ hash: $route.hash })` and be used directly in [scrollBehavior](/api/#scrollbehavior)'s `el` option.
404
+
-`hash` is now decoded, that way it can be copied over: `router.push({ hash: $route.hash })` and be used directly in [scrollBehavior](../../api/#scrollbehavior)'s `el` option.
401
405
- When using `push`, `resolve`, and `replace` and providing a `string` location or a `path` property in an object, **it must be encoded** (like in the previous version). On the other hand, `params`, `query` and `hash` must be provided in its unencoded version.
402
406
- The slash character (`/`) is now properly decoded inside `params` while still producing an encoded version on the URL: `%2F`.
403
407
@@ -417,6 +421,6 @@ To make typings more consistent and expressive, some types have been renamed:
417
421
418
422
Some of new features to keep an eye on in Vue Router 4 include:
Copy file name to clipboardExpand all lines: docs/introduction.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -13,7 +13,7 @@ Vue Router is the official router for [Vue.js](http://v3.vuejs.org). It deeply i
13
13
- Customizable Scroll Behavior
14
14
- Proper encoding for URLs
15
15
16
-
[Get started](/guide/) or play with the [playground](https://github.com/vuejs/vue-router-next/tree/master/playground) (see [`README.md`](https://github.com/vuejs/vue-router-next) to run them).
16
+
[Get started](./guide/) or play with the [playground](https://github.com/vuejs/vue-router-next/tree/master/playground) (see [`README.md`](https://github.com/vuejs/vue-router-next) to run them).
0 commit comments