页面路由与导航:鸿蒙页面跳转的三种方式

应用不是单页的:列表点进详情、首页跳转设置,导航是应用的“道路”。鸿蒙提供多种导航方式,选对方式,代码清晰、体验顺滑。

方式一:router 路由

router 是基础的页面跳转方式:router.pushUrl({ url: ‘pages/Detail’, params: {…} }) 跳转并传参,router.back() 返回,router.replaceUrl 替换当前页。

优点是简单直接,适合页面少的应用;缺点是页面栈管理需要自己留意,页面多了容易乱。

页面路由与导航:鸿蒙页面跳转的三种方式开发示例图

方式二:Navigation 组件

Navigation 是 ArkUI 推荐的导航组件:它管理页面栈和导航栏,支持标题栏、返回逻辑、转场动画,适合复杂应用和底部 Tab 结构。

Navigation 的页面通过路由表注册,跳转用 this.getUIContext().getRouter() 或 Navigation 提供的方法,返回和转场都由组件处理。

方式三:深链与外部跳转

深链让应用可以被外部拉起:浏览器链接、短信、其他应用都能通过深链打开应用指定页面。需要在配置里注册 scheme 和匹配规则。

深链常用于营销活动、分享链接、跨应用协作,是“外部流量进入应用”的通道。

页面路由与导航:鸿蒙页面跳转的三种方式架构示意图

怎么选

小应用、简单跳转:router 够用;中大型应用、Tab 结构:Navigation;需要外部拉起:加深链。实际项目中,Navigation + 深链的组合最常见。

无论哪种方式,页面都要在路由表中注册,跳转参数要注意类型安全。

导航体验的细节

好的导航体验包括:转场动画流畅、返回逻辑符合预期、页面状态保留(列表位置不丢)、加载状态清晰。这些细节决定应用的“高级感”。

导航是应用的骨架,选对方式、做好细节,用户才能顺畅地在你应用里“走来走去”。

发表评论