Releases: vuejs/vue-router
v2.4.0
New
-
The
nextfunction in navigation guards can now accept an Error. This will be considered an explicit error, whereas callingnext(false)is considered a "silent abort". -
New router instance method:
router.onError(errorCallback). The registered callback will be triggered under the following conditions:-
The error is thrown synchronously inside a route guard function;
-
The error is caught and asynchronously handled by calling
next(err)inside a route guard function; -
An error occurred when trying to resolve an async component that is required to render a route.
-
-
router.onReadynow accepts an additional second argument, which is an error callback which will be called when the initial route resolution fails.
Fixed
v2.3.0
v2.2.1
v2.2.0
New Features
-
Passing Props to Route Components
Instead of relying on the magic
$routeproperty, you can now use thepropsroute config option to inject route params into route components as props. -
New in-component hook:
beforeRouteUpdateThis new in-component hook is called when the route that renders this component has changed, but this component is reused in the new route.
For example, for a route with dynamic params
/foo/:id, when we navigate between/foo/1and/foo/2, the sameFoocomponent instance will be reused, and this hook will be called when that happens. Previously you will have to setup a watcher on$routeto achieve the same.This hook has access to
thiscomponent instance. -
New router instance method:
router.onReadyThis method queues a callback to be called 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.
This is useful in server-side rendering to ensure consistent output on both the server and the client.
-
New router instance method:
router.addRoutesDynamically add more routes to the router. The argument must be an Array using the same route config format with the
routesconstructor option. -
Callbacks for
router.push()androuter.replace()You can now optionally provide
onCompleteandonAbortcallbacks torouter.pushorrouter.replaceas the 2nd and 3rd arguments. These callbacks will be called when the navigation either successfully completed (after all async hooks are resolved), or aborted (navigated to the same route, or to a different route before current navigation has finished), respectively. -
Shared Router Instance for Multiple Root Components
Thanks to the contribution by @jhartman86 via #1108!
It is now supported to use the same router instance to drive multiple root components on the same page.
Changes
-
router.resolvereturn value changed to:{ location: Location; route: Route; href: string; }
The old
resolvedandnormalizedTofields are deprecated, but preserved for backwards compatibility. -
URL query encoding now better conforms to RFC3986:
- now encodes
!'()*. - no longer encodes
,.
- now encodes
Fixed
v2.1.3
v2.1.2
Fixed
- #967 fix
getAttributeerror when the element rendered by<router-link>doesn't have the method (e.g. SVG elements) (@AnthonySendra) - #983 respect
basein abstract mode (@atinux via #1045) - #987 support nested children for aliased paths
-#1036 fix checking e.button for non-mouse events (@fnlctrl via #1037) - #1091 fix active route matching (@posva via #1101)
<router-view>now preserves rendered route component when the tree is toggled inactive by<keep-alive>.
v2.1.1
v2.1.0
Dist File Change
The main for the NPM package is now vue-router.common.js. This requires no change for existing build setups. The only difference is that the CDN link for the browser-build is now https://unpkg.com/vue-router@2.0.3/dist/vue-router.js.
New
-
New method:
router.resolve()(@hogart via #918). The user can use this method to get a resolved route object or href string. The signature for this method is:resolve (to: RawLocation, current?: Route, append?: boolean): { normalizedTo: Location; resolved: Route; href: string; }
-
router.getMatchedComponents()can now resolve and determine the matched components for the location passed to it as argument. Note during server-side rendering, you will still need to explicitlyrouter.push()the url so that the$routeobject is available to data preFetch functions. -
router.push()androuter.replace()can now accept a location object with just params:router.push({ params: { foo: 'bar' }})
Note this will do nothing if the current active route doesn't have the matching params; it is your responsibility to ensure this only gets called on appropriate routes.
-
router.push()androuter.replace()now also acceptappend: truein the location object:// will navigate to /foo/bar from /foo router.push({ path: 'bar', append: true })
-
When using
nextin route navigation for a redirect, guards now acceptreplace: truein the location object:router.beforeEach((to, from, next) => { if (to.path === '/foo') { next({ path: '/bar', replace: true }) } })
-
New prop
eventfor<router-link>, allows defining the events to trigger a navigation. Can be a string or an Array of strings.
Fixed
v2.0.3
v2.0.2
Fixed
- #779 fix
beforeRouteEnter'snext(vm => {})not always called when using the same component for multiple routes - #780
<router-link>now sets a hashed path to href when using hash-mode (@LinusBorg via #809) - #795 Allow calling router instance methods before vue instantiation (@fnlctrl via #797)
- #805 Allow alias option to be an empty string (@LinusBorg via #806)
- #810 fix
<router-link>withtagprop not updating static inner<a> - #813 fix sessionStorage quota error in Safari private mode
- #818 fix in-component router hooks not working with
Vue.extend - fix in-component router hooks not working with mixins
- #826 router-link active inclusive match should ignore trailing slash
- #827 Support
target="_blank"for<router-link>(@fnlctrl via #830) - #850 Allow route to use current params to fill ones it does not provide (@wjmao88 via #851)
- #873 fix
$route.querycompat with 3rd party libs due to lack ofhasOwnProperty - #887 fix
beforeRouteLeavethat prevents a navigation not called whenhistory.back()is called more than once (@crossjs via #894)