当前位置:   article > 正文

第一节 vue3 router内置类型有哪些_routelocationpathraw

routelocationpathraw

Vue 3的Router中,有以下内置的路由类型:

1.RouteRecordRaw:表示一个原始的路由记录对象,用于定义路由配置。例如:

const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: About
  },
];
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

2.RouteRecordName:是一个内置类型,用于指定路由记录的名称。它主要用于在程序中进行路由导航时的标识和匹配。

const routes = [
  {
    path: '/',
    name: 'home',
    component: Home
  },
  {
    path: '/about',
    name: 'about',
    component: About
  },
  // ...
]
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

3.RouteLocationRaw:表示一个原始的路由位置对象,用于描述一个路由的位置。例如:

const location: RouteLocationRaw = {
  path: '/',
  query: { id: '1' },
};
  • 1
  • 2
  • 3
  • 4

3.RouterOptions:表示一个路由器的选项对象,用于配置路由器实例。例如:

const routerOptions: RouterOptions = {
  history: createWebHistory(),
  routes,
};
  • 1
  • 2
  • 3
  • 4

4.RouteParams:表示一个路由参数对象,用于获取路由路径中的参数。例如:

const routeParams: RouteParams = {
  id: '1',
};
  • 1
  • 2
  • 3

还有很多vue3 router内置类型,稍后继续更新

1. RouteRecordRaw
2. RouteRecordName
3. RouteRecordRedirectOption
4. RouteLocationRaw
5. RouteLocationRedirectOption
6. RouteLocationNormalized
7. NavigationGuard
8. RouterOptions
9. Router
10. RouterLinkProps
11. RouterViewProps
12. RouterLink
13. RouterView
14. RouteMeta
15. RouteQueryAndHash
16. RouteParams
17. RouteQueryAndHashOptions
18. RouteParamsOptions
19. ScrollPositionCoordinates
20. ScrollBehaviorOptions
21. ScrollBehaviorHandler
22. NavigationFailureType
23. NavigationFailure
24. RouteLocationMatched
25. RouteLocationNormalizedLoaded
26. RouteLocationNormalizedWithParams
27. RouterHistoryState
28. HistoryStateListener
29. HistoryState
30. HistoryLocationNormalizedLoaded
31. HistoryLocationNormalizedWithData
32. HistoryLocationNormalizedWithHash
33. HistoryLocationNormalizedWithQuery
34. RouteLocationNormalizedLooseLoaded
35. RouteLocationNormalizedLooseWithParams
36. RouteLocationNormalizedLooseWithQuery
37. RouteLocationNormalizedLooseWithHash
38. NavigationHookAfterReturn
39. NavigationHookNextCallbackAfterPromise
40. NavigationHookAfterPromise
41. NavigationGuardNext
42. ErrorHandlerResult
43. ErrorHandlerNextFn
44. ErrorHandlerNextCallbackFn
45. ErrorHandlerContext
46. ErrorHandlerNextCallbackContext
47. ErrorHandlerNextCallbackContextWithRedirect
48. ErrorHandlerWarnCallbackContextWithRedirect
49. ErrorHandlerWarnCallbackContextWithoutRedirect
50. ErrorHandlerWarnCallbackContext
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/633261
推荐阅读
相关标签
  

闽ICP备14008679号