Skip to content

useRouteParams

Category
Export Size
518 B
Package
@vueuse/router
Last Changed
6 months ago

Shorthand for a reactive route.params. Available in the @vueuse/router add-on.

Usage

ts
import { 
useRouteParams
} from '@vueuse/router'
const
userId
=
useRouteParams
('userId')
const
userId
=
useRouteParams
('userId', '-1') // or with a default value
const
userId
=
useRouteParams
('page', '1', {
transform
:
Number
}) // or transforming value
console
.
log
(
userId
.
value
) // route.params.userId
userId
.
value
= '100' // router.replace({ params: { userId: '100' } })

Type Declarations

ts
export declare function 
useRouteParams
(
name
: string,
):
Ref
<null | string | string[]>
export declare function
useRouteParams
<
T
extends
RouteParamValueRaw
=
RouteParamValueRaw
,
K
=
T
,
>(
name
: string,
defaultValue
?:
MaybeRefOrGetter
<
T
>,
options
?:
ReactiveRouteOptionsWithTransform
<
T
,
K
>,
):
Ref
<
K
>

Source

SourceDocs

Contributors

Anthony Fu
Anthony Fu
Antério Vieira
IlyaL
alexchexes
Stefan Vojvodic
Guillaume Chau
jack-allocate
Lindsay Gaines
huiliangShen
Manoah Tervoort
Shean de Montigny-Desautels
Eduardo Wesley
Dvir Hazout
Curt Grimes
DevilTea

Changelog

v12.8.0 on
7432f - feat(types): deprecate MaybeRef and MaybeRefOrGetter in favor of Vue's native (#4636)
v12.3.0 on
bba3f - feat(router): support partial transform (#4426)
59f75 - feat(toValue): deprecate toValue from @vueuse/shared in favor of Vue's native
v12.1.0 on
23fdb - fix(useRouteParams,useRouteQuery): set route param/query to undefined when defaultValue is ref or getter (#3977)
v12.0.0-beta.1 on
0a9ed - feat!: drop Vue 2 support, optimize bundles and clean up (#4349)
v11.3.0 on
65aa0 - feat(router): transform get / set (#4326)
44772 - fix(useRouteParams, useRouteQuery): effect triggers twice with object getter as watch source (#4283)
v11.0.0-beta.3 on
965bf - fix(useRouteHash, useRouteParams, useRouteQuery): fix effect triggering multiple times (#4113)
v10.10.0 on
4a882 - fix: support optional params (#3934)
v10.8.0 on
c44fe - fix(useRouteParams,useRouteQuery): set route param/query to undefined when null or defaultValue (#3583)
v10.6.0 on
771e7 - fix(useRouteQuery,useRouteParams): prevent reset on other scope dispose (#3418)
v10.3.0 on
0d02f - fix(router): improves router functions: synchronize values, adds tests, and optimize performance (#3184)
v10.2.0 on
d5252 - fix(useRouteHash,useRouteQuery,useRouteParams): re-evaluates the value immediately (#3002)
v10.0.0-beta.4 on
d23ca - feat(useRouteQuery,useRouteParams): new transform handler (#2191)

Released under the MIT License.

FREE WEEKEND
Free access to Official Vue.js Certification Training
NOW LIVE
Start Now
18
hours
:
03
minutes
:
49
seconds
: