useRouteParams ​
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' } })
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' } })
Source ​
Contributors ​
Changelog ​
v10.3.0
on 7/30/20230d02f
- fix(router): improves router functions: synchronize values, adds tests, and optimize performance (#3184)v10.2.0
on 6/16/2023v10.0.0-beta.4
on 4/13/2023v9.4.0
on 10/25/2022be36a
- fix(useRouteHash, useRouteParams, useRouteQuery): override only selected route param (#2350)v8.9.0
on 7/6/2022