API 文档

您所在的位置:网站首页 vue的官网 API 文档

API 文档

2023-08-16 23:00| 来源: 网络整理| 查看: 265

API 文档

API 文档 ​TS 枚举 ​NavigationFailureTypeTS 接口 ​HistoryStateNavigationFailureNavigationGuardNavigationGuardNextNavigationGuardWithThisNavigationHookAfterRouteLocationRouteLocationMatchedRouteLocationNormalizedRouteLocationNormalizedLoadedRouteLocationOptionsRouteMetaRouteRecordNormalizedRouterRouterHistoryRouterLinkPropsRouterOptionsRouterScrollBehaviorRouterViewPropsTS 类型别名 ​LocationQuery ​

Ƭ LocationQuery: Record

出现在 RouteLocationNormalized 中的规范化查询对象。

LocationQueryRaw ​

Ƭ LocationQueryRaw: Record

松散的 LocationQuery 对象,可以被传递给诸如 push、replace 或任何创建 RouteLocationRaw 的函数。

PathParserOptions ​

Ƭ PathParserOptions: Pick

RouteComponent ​

Ƭ RouteComponent: Component | DefineComponent

在 RouteLocationMatched 中允许的组件。

RouteLocationRaw ​

Ƭ RouteLocationRaw: string | RouteLocationPathRaw | RouteLocationNamedRaw

用户级别的路由位置。

RouteParams ​

Ƭ RouteParams: Record

RouteParamsRaw ​

Ƭ RouteParamsRaw: Record

RouteRecord ​

Ƭ RouteRecord: RouteRecordNormalized

一个路由记录的规范化版本。

RouteRecordName ​

Ƭ RouteRecordName: string | symbol

用户定义的路由记录的可能的名称。

RouteRecordRaw ​

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

UseLinkOptions ​

Ƭ UseLinkOptions: VueUseOptions

变量 ​RouterLink ​

• Const RouterLink: _RouterLinkI

用来渲染一个链接的组件,该链接在被点击时会触发导航。

RouterView ​

• Const RouterView: () => { $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & RouterViewProps ; $slots: { default?: (__namedParameters: { Component: VNode ; route: RouteLocationNormalizedLoaded }) => VNode[] } }

类型声明 ​

• new RouterView()

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

START_LOCATION ​

• Const START_LOCATION: RouteLocationNormalizedLoaded

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

示例

jsimport { START_LOCATION } from 'vue-router' router.beforeEach((to, from) => { if (from === START_LOCATION) { // 初始导航 } })import { START_LOCATION } from 'vue-router' router.beforeEach((to, from) => { if (from === START_LOCATION) { // 初始导航 } })函数 ​createMemoryHistory ​

▸ createMemoryHistory(base?): RouterHistory

创建一个基于内存的历史。该历史的主要目的是为了处理服务端渲染。它从一个不存在的特殊位置开始。用户可以通过调用 router.push 或 router.replace 将该位置替换成起始位置。

参数 ​名称类型默认值描述basestring''所有 URL 的基础位置,默认为 '/'返回值 ​

RouterHistory

一个历史对象,可以传递给路由器构造函数。

createRouter ​

▸ createRouter(options): Router

创建一个可以被 Vue 应用使用的 Router 实例。

参数 ​名称类型描述optionsRouterOptionsRouterOptions返回值 ​

Router

createWebHashHistory ​

▸ createWebHashHistory(base?): RouterHistory

创建一个 hash 模式的历史。在没有主机的 web 应用 (如 file://) 或无法通过配置服务器来处理任意 URL 的时候非常有用。

示例

js// 基于 https://example.com/folder createWebHashHistory() // 给出一个 `https://example.com/folder#` 的 URL createWebHashHistory('/folder/') // 给出一个 `https://example.com/folder/#` 的 URL // 如果其基础位置提供了 `#`,则不会被 `createWebHashHistory` 添加 createWebHashHistory('/folder/#/app/') // 给出一个 `https://example.com/folder/#/app/` 的 URL // 你应该避免这样做,因为它改变了原始的 URL 且破坏了复制 URL 的工作 createWebHashHistory('/other-folder/') // 给出一个 `https://example.com/other-folder/#` 的 URL // 基于 file:///usr/etc/folder/index.html // 对于没有 `host` 的位置,该 base 会被忽略 createWebHashHistory('/iAmIgnored') // 给出一个 `file:///usr/etc/folder/index.html#` 的 URL// 基于 https://example.com/folder createWebHashHistory() // 给出一个 `https://example.com/folder#` 的 URL createWebHashHistory('/folder/') // 给出一个 `https://example.com/folder/#` 的 URL // 如果其基础位置提供了 `#`,则不会被 `createWebHashHistory` 添加 createWebHashHistory('/folder/#/app/') // 给出一个 `https://example.com/folder/#/app/` 的 URL // 你应该避免这样做,因为它改变了原始的 URL 且破坏了复制 URL 的工作 createWebHashHistory('/other-folder/') // 给出一个 `https://example.com/other-folder/#` 的 URL // 基于 file:///usr/etc/folder/index.html // 对于没有 `host` 的位置,该 base 会被忽略 createWebHashHistory('/iAmIgnored') // 给出一个 `file:///usr/etc/folder/index.html#` 的 URL参数 ​名称类型描述base?string可选提供的基础位置。默认为 location.pathname + location.search。如果在 head 中有一个 标签,它的值会因此被忽略,但注意它会影响所有 history.pushState() 的调用,这意味着如果你使用一个 标签,它的 href 值必须与这个参数匹配 (忽略 # 后的任何东西)。返回值 ​

RouterHistory

createWebHistory ​

▸ createWebHistory(base?): RouterHistory

创建一个 HTML5 历史。对于单页应用来说这是最常见的历史。

参数 ​名称类型base?string返回值 ​

RouterHistory

isNavigationFailure ​

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

检查一个对象是否是 NavigationFailure。

示例

jsimport { isNavigationFailure, NavigationFailureType } from 'vue-router' router.afterEach((to, from, failure) => { // 任何类型的导航失败 if (isNavigationFailure(failure)) { // ... } // 重复的导航 if (isNavigationFailure(failure, NavigationFailureType.duplicated)) { // ... } // 中止或取消的导航 if (isNavigationFailure(failure, NavigationFailureType.aborted | NavigationFailureType.canceled)) { // ... } })import { isNavigationFailure, NavigationFailureType } from 'vue-router' router.afterEach((to, from, failure) => { // 任何类型的导航失败 if (isNavigationFailure(failure)) { // ... } // 重复的导航 if (isNavigationFailure(failure, NavigationFailureType.duplicated)) { // ... } // 中止或取消的导航 if (isNavigationFailure(failure, NavigationFailureType.aborted | NavigationFailureType.canceled)) { // ... } })参数 ​名称类型描述errorany可能的 NavigationFailuretype?NAVIGATION_GUARD_REDIRECT可选的待检查类型返回值 ​

error is NavigationRedirectError

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

参数 ​名称类型erroranytype?ErrorTypes | NavigationFailureType返回值 ​

error is NavigationFailure

loadRouteLocation ​

▸ loadRouteLocation(route): Promise

确保路由被加载,所以它可以作为一个 prop 传递给 。

参数 ​名称类型描述routeRouteLocationNormalized解析要加载的路由返回值 ​

Promise

onBeforeRouteLeave ​

▸ onBeforeRouteLeave(leaveGuard): void

添加一个导航守卫,不论当前位置的组件何时离开都会触发。类似于 beforeRouteLeave,但可以在任意组件中使用。当组件被卸载时,该守卫会被移除。

参数 ​名称类型描述leaveGuardNavigationGuardNavigationGuard返回值 ​

void

onBeforeRouteUpdate ​

▸ onBeforeRouteUpdate(updateGuard): void

添加一个导航守卫,不论当前位置何时被更新都会触发。类似于 beforeRouteUpdate,但可以在任何组件中使用。当组件被卸载时,该守卫会被移除。

参数 ​名称类型描述updateGuardNavigationGuardNavigationGuard返回值 ​

void

useLink ​

▸ useLink(props): Object

参数 ​名称类型propsVueUseOptions返回值 ​

Object

名称类型hrefComputedRefisActiveComputedRefisExactActiveComputedRefnavigate(e: MouseEvent) => PromiserouteComputedRefuseRoute ​

▸ useRoute(): RouteLocationNormalizedLoaded

返回当前的路由地址。相当于在模板中使用 $route。

返回值 ​

RouteLocationNormalizedLoaded

useRouter ​

▸ useRouter(): Router

返回路由器实例。相当于在模板中使用 $router。

返回值 ​

Router



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3