路由位置

路由位置（RouteLocation）和路由记录（RouteRecord）是 vitarx-router 中最核心的两个数据结构。RouteLocation 表示当前导航的位置信息，RouteRecord 表示路由注册表中的解析后记录。

RouteLocation

路由位置对象，描述当前导航的完整位置信息。通过 router.route 或 useRoute() 获取的对象即为 RouteLocation 类型。

类型定义

interface RouteLocation {
  href: string
  path: RoutePath
  hash: URLHash | ''
  params: URLParams
  query: URLQuery
  meta: RouteMetaData
  matched: RouteRecord[]
  redirectFrom?: RouteLocation
}

属性说明

属性	类型	说明
href	`string`	完整的 URL 路径，包含 base、路径、查询参数和 hash
path	`RoutePath`	路由路径，如 `/user/123`。可用于导航
hash	`URLHash \| ''`	URL hash 部分，如 `#section`。无 hash 时为空字符串
params	`URLParams`	路由动态参数，具有响应性。如 `{ id: '123' }`
query	`URLQuery`	URL 查询参数，具有响应性。如 `{ page: '1' }`
meta	`RouteMetaData`	路由元数据，由匹配链上所有路由记录的 `meta` 合并而成，子路由优先
matched	`RouteRecord[]`	匹配的路由记录数组，从根路由到当前路由按层级排列
redirectFrom	`RouteLocation`	如果在守卫或路由配置中被重定向，此属性为最初要导航到的路由位置

详情

params 和 query 都是响应式对象，可以通过 watch 监听它们的变化来响应路由参数更新。

matched 数组中的记录顺序为从外到内：matched[0] 是最外层布局路由，matched[matched.length - 1] 是当前页面路由。RouterView 组件根据当前渲染深度从 matched 中选取对应的路由记录。

meta 是所有匹配路由记录的 meta 合并结果，子路由的 meta 字段会覆盖父路由的同名字段。

示例

const route = router.route

// 当前路径
console.log(route.path) // '/user/123'

// 动态参数
console.log(route.params.id) // '123'

// 查询参数
console.log(route.query.tab) // 'profile'

// hash
console.log(route.hash) // '#section'

// 元数据
console.log(route.meta.title) // '用户详情'

// 匹配记录
route.matched.forEach(record => {
  console.log(record.path, record.name)
})

// 判断是否被重定向
if (route.redirectFrom) {
  console.log('从', route.redirectFrom.path, '重定向到', route.path)
}

RouteRecord

路由记录对象，表示路由注册表中解析后的路由信息。每个 RouteRecord 对应一条路由规则。

类型定义

interface RouteRecord {
  isGroup: boolean
  parent?: RouteRecord
  path: RoutePath
  aliases?: RoutePath[]
  name?: RouteName
  meta?: RouteMetaData
  props?: NamedInjectProps
  redirect?: Route['redirect']
  component?: NamedRouteComponent
  beforeEnter?: NavigationGuard | NavigationGuard[]
  pattern?: ResolvedPattern[]
  fullPattern?: RegExp
  rawPattern?: Record<string, RegExp>
  params?: URLParams
  query?: URLQuery
  rawRoute?: Route
  leaveGuards?: Set<RouteLeaveGuard>
  beforeUpdateHooks?: Set<RouteUpdateCallback>
}

属性说明

属性	类型	说明
isGroup	`boolean`	是否为分组路由。分组路由不渲染组件，仅用于组织路由结构
parent	`RouteRecord`	父级路由记录
path	`RoutePath`	路由路径
aliases	`RoutePath[]`	路由别名路径列表
name	`RouteName`	路由名称，用于编程式导航
meta	`RouteMetaData`	路由元数据，可存储任意附加信息
props	`NamedInjectProps`	需要注入给组件的参数配置（命名视图格式）
redirect	`Route['redirect']`	路由重定向配置，可以是目标路径、`NavOptions` 或重定向处理函数
component	`NamedRouteComponent`	路由对应的视图组件，支持命名视图（如 `{ default: Home, sidebar: Nav }`）
beforeEnter	`NavigationGuard \| NavigationGuard[]`	路由独享守卫，进入该路由前执行
pattern	`ResolvedPattern[]`	解析后的动态路由参数匹配模式，包含参数名、正则表达式和是否可选
fullPattern	`RegExp`	完整的动态路由参数匹配正则表达式
rawPattern	`Record<string, RegExp>`	原始的路由模式配置（用于子路由继承）
params	`URLParams`	路由参数，具有响应性。仅在导航确认后存在
query	`URLQuery`	路由查询参数，具有响应性。仅在导航确认后存在
rawRoute	`Route`	原始路由配置对象（仅开发环境存在，生产环境会移除）
leaveGuards	`Set<RouteLeaveGuard>`	@internal 离开守卫集合
beforeUpdateHooks	`Set<RouteUpdateCallback>`	@internal 更新钩子集合

详情

RouteRecord 与 Route 的区别：

Route 是用户定义路由时的配置接口，包含 children、alias 等声明式字段
RouteRecord 是路由注册表中解析后的记录，包含 parent、pattern、fullPattern 等运行时信息

component 字段使用 NamedRouteComponent 类型，支持命名视图：

type NamedRouteComponent = {
  default: Component
  [key: string]: Component
}

pattern 字段的结构：

type ResolvedPattern = { name: string; regex: RegExp; optional: boolean }

每个元素表示一个动态路径参数的匹配规则，例如 /user/{id} 会被解析为 [{ name: 'id', regex: /[^/]+/, optional: false }]。

示例

// 访问当前路由的匹配记录
const record = router.route.matched[0]

console.log(record.path) // '/user/{id}'
console.log(record.name) // 'user'
console.log(record.isGroup) // false
console.log(record.meta) // { title: '用户' }
console.log(record.component) // { default: UserComponent }

参考：路由匹配