useRouteParams
对响应式的 route.params
的简写。 Available in the @vueuse/router add-on.
用法
ts
import { useRouteParams } from '@vueuse/router'
const userId = useRouteParams('userId')
const userId = useRouteParams('userId', '-1') // 或者带有默认值
const userId = useRouteParams('page', '1', { transform: Number }) // 或者进行值转换
console.log(userId.value) // route.params.userId
userId.value = '100' // router.replace({ params: { userId: '100' } })
类型声明
typescript
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>
源码
贡献者
更新日志
v12.8.0
on v12.3.0
on 59f75
- feat(toValue): deprecate toValue
from @vueuse/shared
in favor of Vue's nativev12.1.0
on 23fdb
- fix(useRouteParams,useRouteQuery): set route param/query to undefined when defaultValue is ref or getter (#3977)v11.3.0
on 44772
- fix(useRouteParams, useRouteQuery): effect triggers twice with object getter as watch source (#4283)965bf
- fix(useRouteHash, useRouteParams, useRouteQuery): fix effect triggering multiple times (#4113)v10.10.0
on v10.8.0
on c44fe
- fix(useRouteParams,useRouteQuery): set route param/query to undefined when null or defaultValue (#3583)v10.6.0
on v10.3.0
on 0d02f
- fix(router): improves router functions: synchronize values, adds tests, and optimize performance (#3184)v10.2.0
on