路由系统

项目使用 @uni-helper/vite-plugin-uni-pages 实现基于文件系统的路由，配合 uni-mini-router 进行编程式导航。

页面跳转

// 保留当前页
uni.navigateTo({ url: '/pages/detail/index?id=123' })

// 不保留当前页
uni.redirectTo({ url: '/pages/login/index' })

// 关闭所有页面
uni.reLaunch({ url: '/pages/index/index' })

// 编程式导航（uni-mini-router）
router.push({ path: '/pages/mine/profile/index' })

参数传递

// 发送
uni.navigateTo({ url: `/pages/detail/index?id=${id}&type=${type}` })

// 接收
onLoad((options) => {
  const { id, type } = options
})

复杂对象使用事件总线：

// 发送
uni.navigateTo({ url: '/pages/detail/index', success: () => uni.$emit('passData', data) })

// 接收
onMounted(() => uni.$on('passData', (data) => { /* ... */ }))
onUnmounted(() => uni.$off('passData'))

页面配置

在每个 .vue 文件中通过 <route> 块定义页面配置：

<!-- TabBar 页面 -->
<route lang="json">
{
  "name": "home",
  "style": { "navigationStyle": "custom" },
  "layout": "tabbar"
}
</route>

<!-- 普通页面 -->
<route lang="json">
{
  "name": "profile",
  "style": { "navigationBarTitleText": "个人资料" }
}
</route>

<!-- 自定义导航栏页面 -->
<route lang="json">
{
  "name": "account",
  "style": { "navigationStyle": "custom" }
}
</route>

配置项

属性	类型	说明
name	string	路由名称
style	object	页面样式配置，同 pages.json
layout	string | false	布局组件，false 不使用布局
meta	object	自定义元数据

布局配置

在 <route> 块中通过 layout 字段指定页面布局：

<route lang="json">
{
  "name": "home",
  "style": { "navigationStyle": "custom" },
  "layout": "tabbar"
}
</route>

详见 布局系统 文档。