API 文档

API 文档

枚举

接口

类型别名

LocationQuery

Ƭ LocationQuery: Record<string, LocationQueryValue | LocationQueryValue[]>

出现在 RouteLocationNormalized 中的标准化查询对象

LocationQueryRaw

Ƭ LocationQueryRaw: Record<string | number, LocationQueryValueRaw | LocationQueryValueRaw[]>

松散的 LocationQuery 对象，可以传递给 Router.push 和 Router.replace 等函数，或者在创建 RouteLocationRaw 时传递给任何地方

LocationQueryValue

Ƭ LocationQueryValue: string | null

标准化 LocationQuery 中可能的 value。null 会渲染查询参数，但没有 =。

示例

?isNull&isEmpty=&other=other
gives
`{ isNull: null, isEmpty: '', other: 'other' }`.

LocationQueryValueRaw

Ƭ LocationQueryValueRaw: LocationQueryValue | number | undefined

定义查询时可能的 value。

NavigationGuardNextCallback

Ƭ NavigationGuardNextCallback: (vm: ComponentPublicInstance) => unknown

可以传递给 beforeRouteEnter() 守护程序中的 next() 的回调函数。

类型声明

▸ (vm): unknown

参数

名称	类型
`vm`	`ComponentPublicInstance`

返回值

unknown

NavigationGuardReturn

Ƭ NavigationGuardReturn: void | Error | boolean | RouteLocationRaw

导航守护程序的返回类型。基于 TypesConfig

参见

TypesConfig

ParamValue

Ƭ ParamValue<isRaw>: true extends isRaw ? string | number : string

用于 raw 和非 raw 参数（如 :id）的实用程序类型

类型参数

名称	类型
`isRaw`	extends `boolean`

ParamValueOneOrMore

Ƭ ParamValueOneOrMore<isRaw>: [ParamValue<isRaw>, ...ParamValue<isRaw>[]]

用于 raw 和非 raw 参数（如 :id+）的实用程序类型

类型参数

名称	类型
`isRaw`	extends `boolean`

ParamValueZeroOrMore

Ƭ ParamValueZeroOrMore<isRaw>: true extends isRaw ? ParamValue<isRaw>[] | undefined | null : ParamValue<isRaw>[] | undefined

用于 raw 和非 raw 参数（如 :id*）的实用程序类型

类型参数

名称	类型
`isRaw`	extends `boolean`

ParamValueZeroOrOne

Ƭ ParamValueZeroOrOne<isRaw>: true extends isRaw ? string | number | null | undefined : string

用于 raw 和非 raw 参数（如 :id?）的实用程序类型

类型参数

名称	类型
`isRaw`	extends `boolean`

PathParserOptions

Ƭ PathParserOptions: Pick<_PathParserOptions, "end" | "sensitive" | "strict">

RouteComponent

Ƭ RouteComponent: Component | DefineComponent

允许在 RouteLocationMatched 中使用的组件

RouteLocation

Ƭ RouteLocation<Name>: RouteMapGeneric extends RouteMap ? RouteLocationGeneric : RouteLocationTypedList<RouteMap>[Name]

使用匹配器解析的 RouteLocationRaw

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationAsPath

Ƭ RouteLocationAsPath<Name>: RouteMapGeneric extends RouteMap ? RouteLocationAsPathGeneric : RouteLocationAsPathTypedList<RouteMap>[Name]

具有 path 属性的路由位置作为对象。

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationAsPathTypedList

Ƭ RouteLocationAsPathTypedList<RouteMap>: { [N in keyof RouteMap]: RouteLocationAsPathTyped<RouteMap, N> }

所有可能的 RouteLocationAsPath 列表，按路由名称索引。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`

RouteLocationAsRelative

Ƭ RouteLocationAsRelative<Name>: RouteMapGeneric extends RouteMap ? RouteLocationAsRelativeGeneric : RouteLocationAsRelativeTypedList<RouteMap>[Name]

相对于当前位置的路由位置。它接受除 path 之外的其他属性，如 params、query 和 hash，以便方便地更改它们。

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationAsRelativeTypedList

Ƭ RouteLocationAsRelativeTypedList<RouteMap>: { [N in keyof RouteMap]: RouteLocationAsRelativeTyped<RouteMap, N> }

所有可能的 RouteLocationAsRelative 列表，按路由名称索引。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`

RouteLocationAsString

Ƭ RouteLocationAsString<Name>: RouteMapGeneric extends RouteMap ? string : _LiteralUnion<RouteLocationAsStringTypedList<RouteMap>[Name], string>

与 RouteLocationAsPath 相同，但作为字符串字面量。

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationAsStringTyped

Ƭ RouteLocationAsStringTyped<RouteMap, Name>: RouteMap[Name]["path"]

帮助生成 RouteLocationAsString 类型的类型安全版本。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationAsStringTypedList

Ƭ RouteLocationAsStringTypedList<RouteMap>: { [N in keyof RouteMap]: RouteLocationAsStringTyped<RouteMap, N> }

所有可能的 RouteLocationAsString 列表，按路由名称索引。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`

RouteLocationNormalized

Ƭ RouteLocationNormalized<Name>: RouteMapGeneric extends RouteMap ? RouteLocationNormalizedGeneric : RouteLocationNormalizedTypedList<RouteMap>[Name]

类似于 RouteLocation，但其 matched 属性不包含重定向记录。

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationNormalizedLoaded

Ƭ RouteLocationNormalizedLoaded<Name>: RouteMapGeneric extends RouteMap ? RouteLocationNormalizedLoadedGeneric : RouteLocationNormalizedLoadedTypedList<RouteMap>[Name]

类似于 RouteLocationNormalized，但其 components 不包含任何用于延迟加载组件的函数。换句话说，它已准备好由 <RouterView> 渲染。

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationNormalizedLoadedTypedList

Ƭ RouteLocationNormalizedLoadedTypedList<RouteMap>: { [N in keyof RouteMap]: RouteLocationNormalizedLoadedTyped<RouteMap, N> }

所有可能的 RouteLocationNormalizedLoaded 列表，按路由名称索引。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`

RouteLocationNormalizedTypedList

Ƭ RouteLocationNormalizedTypedList<RouteMap>: { [N in keyof RouteMap]: RouteLocationNormalizedTyped<RouteMap, N> }

所有可能的 RouteLocationNormalized 列表，按路由名称索引。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`

RouteLocationRaw

Ƭ RouteLocationRaw<Name>: RouteMapGeneric extends RouteMap ? RouteLocationAsString | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric : _LiteralUnion<RouteLocationAsStringTypedList<RouteMap>[Name], string> | RouteLocationAsRelativeTypedList<RouteMap>[Name] | RouteLocationAsPathTypedList<RouteMap>[Name]

可以传递给 router.push() 和其他面向用户的 API 的路由位置。

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationResolved

Ƭ RouteLocationResolved<Name>: RouteMapGeneric extends RouteMap ? RouteLocationResolvedGeneric : RouteLocationResolvedTypedList<RouteMap>[Name]

使用 router.resolve() 解析的路由位置。

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteLocationResolvedTypedList

Ƭ RouteLocationResolvedTypedList<RouteMap>: { [N in keyof RouteMap]: RouteLocationResolvedTyped<RouteMap, N> }

所有可能的 RouteLocationResolved 列表，按路由名称索引。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`

RouteLocationTypedList

Ƭ RouteLocationTypedList<RouteMap>: { [N in keyof RouteMap]: RouteLocationTyped<RouteMap, N> }

所有可能的 RouteLocation 列表，按路由名称索引。

类型参数

名称	类型
`RouteMap`	extends `RouteMapGeneric` = `RouteMapGeneric`

RouteMap

Ƭ RouteMap: TypesConfig extends Record<"RouteNamedMap", infer RouteNamedMap> ? RouteNamedMap : RouteMapGeneric

获取类型化 RouteMap 或未提供时获取泛型 RouteMap 的便捷类型。如果存在，它将从 TypesConfig 中提取，否则它将成为 RouteMapGeneric。

RouteMapGeneric

Ƭ RouteMapGeneric: Record<string | symbol, RouteRecordInfo>

RouteMap 的泛型版本。

RouteParamValue

Ƭ RouteParamValue: string

RouteParamValueRaw

Ƭ RouteParamValueRaw: RouteParamValue | number | null | undefined

RouteParams

Ƭ RouteParams<Name>: RouteMap[Name]["params"]

为路由位置生成类型安全的参数。需要将路由的名称作为泛型传递。

参见

RouteParamsGeneric

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteParamsGeneric

Ƭ RouteParamsGeneric: Record<string, RouteParamValue | RouteParamValue[]>

RouteParamsRaw

Ƭ RouteParamsRaw<Name>: RouteMap[Name]["paramsRaw"]

为路由位置生成类型安全的原始参数。需要将路由的名称作为泛型传递。

参见

RouteParamsRaw

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

RouteParamsRawGeneric

Ƭ RouteParamsRawGeneric: Record<string, RouteParamValueRaw | Exclude<RouteParamValueRaw, null | undefined>[]>

RouteRecord

Ƭ RouteRecord: RouteRecordNormalized

路由记录的规范化版本。

RouteRecordName

Ƭ RouteRecordName: RouteMapGeneric extends RouteMap ? RouteRecordNameGeneric : keyof RouteMap

规范化后路由记录的可能值

注意：由于 RouteRecordName 是一个类型，它过早地进行评估，通常是泛型版本 RouteRecordNameGeneric。如果您需要所有路由名称的类型化版本，请使用 keyof RouteMap

RouteRecordNameGeneric

Ƭ RouteRecordNameGeneric: string | symbol | undefined

RouteRecordName 的泛型版本。

RouteRecordRaw

Ƭ RouteRecordRaw: RouteRecordSingleView | RouteRecordSingleViewWithChildren | RouteRecordMultipleViews | RouteRecordMultipleViewsWithChildren | RouteRecordRedirect

RouteRecordRedirectOption

Ƭ RouteRecordRedirectOption: RouteLocationRaw | (to: RouteLocation) => RouteLocationRaw

_Awaitable

Ƭ _Awaitable<T>: T | PromiseLike<T>

可能是 promise 也可能不是

类型参数

名称
`T`

_RouteRecordProps

Ƭ _RouteRecordProps<Name>: boolean | Record<string, any> | (to: RouteLocationNormalized<Name>) => Record<string, any>

类型参数

名称	类型
`名称`	extends keyof `RouteMap` = keyof `RouteMap`

变量

RouterLink

• Const RouterLink: _RouterLinkI

用于渲染链接的组件，该链接在点击时触发导航。

RouterView

• Const RouterView: () => { $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & RouterViewProps ; $slots: { default?: (__namedParameters: { Component: VNode<RendererNode, RendererElement, { [key: string]: any; }> ; route: RouteLocationNormalizedLoadedGeneric }) => VNode<RendererNode, RendererElement, { [key: string]: any; }>[] } }

用于显示用户当前所处路由的组件。

类型声明

• new RouterView(): Object

用于显示用户当前所处路由的组件。

Object

名称	类型
`$props`	`AllowedComponentProps` & `ComponentCustomProps` & `VNodeProps` & `RouterViewProps`
`$slots`	{ `default?`: (`__namedParameters`: { `Component`: `VNode`<`RendererNode`, `RendererElement`, { `[key: string]`: `any`; }> ; `route`: `RouteLocationNormalizedLoadedGeneric` }) => `VNode`<`RendererNode`, `RendererElement`, { `[key: string]`: `any`; }>[] }
`$slots.default?`	(`__namedParameters`: { `Component`: `VNode`<`RendererNode`, `RendererElement`, { `[key: string]`: `any`; }> ; `route`: `RouteLocationNormalizedLoadedGeneric` }) => `VNode`<`RendererNode`, `RendererElement`, { `[key: string]`: `any`; }>[]

START_LOCATION

• Const START_LOCATION: RouteLocationNormalizedLoaded

路由器初始路由位置。可以在导航守卫中使用它来区分初始导航。

示例

import { START_LOCATION } from 'vue-router'

router.beforeEach((to, from) => {
  if (from === START_LOCATION) {
    // initial navigation
  }
})

matchedRouteKey

• Const matchedRouteKey: InjectionKey<ComputedRef<undefined | RouteRecordNormalized>>

由最近的祖先 Router View 渲染的 RouteRecord。用于 onBeforeRouteUpdate 和 onBeforeRouteLeave。rvlm 代表 Router View Location Matched

routeLocationKey

• Const routeLocationKey: InjectionKey<RouteLocationNormalizedLoadedGeneric>

允许在测试中覆盖 useRoute 返回的当前路由。rl 代表 route location

routerKey

• Const routerKey: InjectionKey<Router>

允许在测试中覆盖 useRouter 返回的路由器实例。r 代表 router

routerViewLocationKey

• Const routerViewLocationKey: InjectionKey<Ref<RouteLocationNormalizedLoadedGeneric>>

允许覆盖 router-view 使用的当前路由。在内部，当传递 route prop 时，会使用它。

viewDepthKey

• Const viewDepthKey: InjectionKey<number | Ref<number>>

允许覆盖路由视图深度以控制 matched 中渲染的组件。rvd 代表 Router View Depth

函数

createMemoryHistory

▸ createMemoryHistory(base?): RouterHistory

创建一个基于内存的历史记录。此历史记录的主要目的是处理 SSR。它从一个特殊的位置开始，该位置无处不在。用户需要通过调用 router.push 或 router.replace 来将该位置替换为起始位置。

参数

名称	类型	默认值	描述
`base`	`string`	`''`	应用于所有 URL 的基础，默认为 '/'

RouterHistory

一个可以传递给路由器构造函数的历史记录对象

createRouter

▸ createRouter(options): Router

创建一个可以由 Vue 应用程序使用的路由器实例。

参数

名称	类型	描述
`options`	`RouterOptions`	RouterOptions

Router

createRouterMatcher

▸ createRouterMatcher(routes, globalOptions): RouterMatcher

创建一个路由匹配器。

参数

名称	类型	描述
`routes`	readonly `RouteRecordRaw`[]	初始路由数组
`globalOptions`	`PathParserOptions`	全局路由选项

RouterMatcher

createWebHashHistory

▸ createWebHashHistory(base?): RouterHistory

创建一个哈希历史记录。对于没有主机（例如 file://）的 Web 应用程序或当配置服务器以处理任何 URL 不可能时很有用。

参数

名称	类型	描述
`base?`	`string`	要提供的可选基础。默认为 `location.pathname + location.search` 如果 `head` 中存在 `<base>` 标签，则其值将被忽略，有利于此参数，但请注意它会影响所有 history.pushState() 调用，这意味着如果您使用 `<base>` 标签，则其 `href` 值必须与该参数匹配（忽略 `#` 之后的任何内容）。

RouterHistory

示例

// at https://example.com/folder
createWebHashHistory() // gives a url of `https://example.com/folder#`
createWebHashHistory('/folder/') // gives a url of `https://example.com/folder/#`
// if the `#` is provided in the base, it won't be added by `createWebHashHistory`
createWebHashHistory('/folder/#/app/') // gives a url of `https://example.com/folder/#/app/`
// you should avoid doing this because it changes the original url and breaks copying urls
createWebHashHistory('/other-folder/') // gives a url of `https://example.com/other-folder/#`

// at file:///usr/etc/folder/index.html
// for locations with no `host`, the base is ignored
createWebHashHistory('/iAmIgnored') // gives a url of `file:///usr/etc/folder/index.html#`

createWebHistory

▸ createWebHistory(base?): RouterHistory

创建一个 HTML5 历史记录。单页应用程序最常见的历史记录。

参数

名称	类型
`base?`	`string`

RouterHistory

isNavigationFailure

▸ isNavigationFailure(error, type?): error is NavigationRedirectError

检查一个对象是否为 NavigationFailure。

参数

名称	类型	描述
`error`	`any`	可能的 NavigationFailure
`type?`	`NAVIGATION_GUARD_REDIRECT`	要检查的可选类型

error is NavigationRedirectError

示例

import { isNavigationFailure, NavigationFailureType } from 'vue-router'

router.afterEach((to, from, failure) => {
  // Any kind of navigation failure
  if (isNavigationFailure(failure)) {
    // ...
  }
  // Only duplicated navigations
  if (isNavigationFailure(failure, NavigationFailureType.duplicated)) {
    // ...
  }
  // Aborted or canceled navigations
  if (isNavigationFailure(failure, NavigationFailureType.aborted | NavigationFailureType.canceled)) {
    // ...
  }
})

▸ isNavigationFailure(error, type?): error is NavigationFailure

参数

名称	类型
`error`	`any`
`type?`	`ErrorTypes` \| `NavigationFailureType`

error is NavigationFailure

loadRouteLocation

▸ loadRouteLocation(route): Promise<RouteLocationNormalizedLoaded>

确保路由已加载，以便可以将其作为 prop 传递给 <RouterView>。

参数

名称	类型	描述
`route`	`RouteLocationNormalizedGeneric` \| `RouteLocationGeneric`	要加载的已解析路由

Promise<RouteLocationNormalizedLoaded>

onBeforeRouteLeave

▸ onBeforeRouteLeave(leaveGuard): void

添加一个导航守卫，每当当前位置的组件即将离开时触发。类似于 beforeRouteLeave，但可以在任何组件中使用。当组件卸载时，守卫将被移除。

参数

名称	类型	描述
`leaveGuard`	`NavigationGuard`	NavigationGuard

void

onBeforeRouteUpdate

▸ onBeforeRouteUpdate(updateGuard): void

添加一个导航守卫，每当当前位置即将更新时触发。类似于 beforeRouteUpdate，但可以在任何组件中使用。当组件卸载时，守卫将被移除。

参数

名称	类型	描述
`updateGuard`	`NavigationGuard`	NavigationGuard

void

parseQuery

▸ parseQuery(search): LocationQuery

将 queryString 转换为 LocationQuery 对象。接受两者，一个带有前导 ? 的版本和没有前导 ? 的版本。应该像 URLSearchParams 一样工作

参数

名称	类型	描述
`search`	`string`	要解析的搜索字符串

LocationQuery

一个查询对象

stringifyQuery

▸ stringifyQuery(query): string

将 LocationQueryRaw 对象字符串化。像 URLSearchParams 一样，它不会添加前导 ?

参数

名称	类型	描述
`query`	`LocationQueryRaw`	要字符串化的查询对象

string

查询的字符串版本，没有前导 ?

useLink

▸ useLink<Name>(props): UseLinkReturn<Name>

返回 RouterLink 的内部行为，不包括渲染部分。

类型参数

名称	类型
`名称`	extends `string` \| `symbol` = `string` \| `symbol`

参数

名称	类型	描述
`props`	`UseLinkOptions`<`Name`>	一个 `to` 位置和一个可选的 `replace` 标志

UseLinkReturn<Name>

useRoute

▸ useRoute<Name>(_name?): RouteLocationNormalizedLoaded<Name>

返回当前路由位置。等同于在模板中使用 $route。

类型参数

名称	类型
`名称`	extends `string` \| `symbol` = `string` \| `symbol`

参数

名称	类型
`_name?`	`名称`

RouteLocationNormalizedLoaded<Name>

useRouter

▸ useRouter(): Router

返回路由实例。等同于在模板中使用 $router。

Router

成为赞助商

VueMastery

Prefect

API 文档 ​

枚举 ​

接口 ​

类型别名 ​

LocationQuery ​

LocationQueryRaw ​

LocationQueryValue ​

LocationQueryValueRaw ​

NavigationGuardNextCallback ​

类型声明 ​

参数 ​

返回值 ​

NavigationGuardReturn ​

ParamValue ​

类型参数 ​

ParamValueOneOrMore ​

类型参数 ​

ParamValueZeroOrMore ​

类型参数 ​

ParamValueZeroOrOne ​

类型参数 ​

PathParserOptions ​

RouteComponent ​

RouteLocation ​

类型参数 ​

RouteLocationAsPath ​

类型参数 ​

RouteLocationAsPathTypedList ​

类型参数 ​

RouteLocationAsRelative ​

类型参数 ​

RouteLocationAsRelativeTypedList ​

类型参数 ​

RouteLocationAsString ​

类型参数 ​

RouteLocationAsStringTyped ​

类型参数 ​

RouteLocationAsStringTypedList ​

类型参数 ​

RouteLocationNormalized ​

类型参数 ​

RouteLocationNormalizedLoaded ​

类型参数 ​

RouteLocationNormalizedLoadedTypedList ​

类型参数 ​

RouteLocationNormalizedTypedList ​

类型参数 ​

RouteLocationRaw ​

类型参数 ​

RouteLocationResolved ​

类型参数 ​

RouteLocationResolvedTypedList ​

类型参数 ​

RouteLocationTypedList ​

类型参数 ​

RouteMap ​

RouteMapGeneric ​

RouteParamValue ​

RouteParamValueRaw ​

RouteParams ​

类型参数 ​

RouteParamsGeneric ​

RouteParamsRaw ​

类型参数 ​

RouteParamsRawGeneric ​

RouteRecord ​

RouteRecordName ​

RouteRecordNameGeneric ​

RouteRecordRaw ​

RouteRecordRedirectOption ​

_Awaitable ​

类型参数 ​

_RouteRecordProps ​

类型参数 ​

变量 ​

RouterLink ​

RouterView ​

枚举

接口

类型别名

LocationQuery

LocationQueryRaw

LocationQueryValue

LocationQueryValueRaw

NavigationGuardNextCallback

类型声明

参数

返回值

NavigationGuardReturn

ParamValue

类型参数

ParamValueOneOrMore

类型参数

ParamValueZeroOrMore

类型参数

ParamValueZeroOrOne

类型参数

PathParserOptions

RouteComponent

RouteLocation

类型参数

RouteLocationAsPath

类型参数

RouteLocationAsPathTypedList

类型参数

RouteLocationAsRelative

类型参数

RouteLocationAsRelativeTypedList

类型参数

RouteLocationAsString

类型参数

RouteLocationAsStringTyped

类型参数

RouteLocationAsStringTypedList

类型参数

RouteLocationNormalized

类型参数

RouteLocationNormalizedLoaded

类型参数

RouteLocationNormalizedLoadedTypedList

类型参数

RouteLocationNormalizedTypedList

类型参数

RouteLocationRaw

类型参数

RouteLocationResolved

类型参数

RouteLocationResolvedTypedList

类型参数

RouteLocationTypedList

类型参数

RouteMap

RouteMapGeneric

RouteParamValue

RouteParamValueRaw

RouteParams

类型参数

RouteParamsGeneric

RouteParamsRaw

类型参数

RouteParamsRawGeneric

RouteRecord

RouteRecordName

RouteRecordNameGeneric

RouteRecordRaw

RouteRecordRedirectOption

_Awaitable

类型参数

_RouteRecordProps

类型参数

变量

RouterLink

RouterView

类型声明

返回

START_LOCATION