目前鸿蒙官网已经已经在逐步放弃@ohos.router下面放一张官网的截图:
这里做一个对比:
业务场景 | Navigation | Router |
---|---|---|
一多能力 | 支持,Auto模式自适应单栏跟双栏显示 | 不支持 |
跳转指定页面 | pushPath & pushDestination | pushUrl & pushNameRoute |
跳转HSP中页面 | 支持 | 支持 |
跳转HAR中页面 | 支持 | 支持 |
跳转传参 | 支持 | 支持 |
获取指定页面参数 | 支持 | 不支持 |
传参类型 | 传参为对象形式 | 传参为对象形式,对象中暂不支持方法变量 |
跳转结果回调 | 支持 | 支持 |
跳转单例页面 | 支持 | 支持 |
页面返回 | 支持 | 支持 |
页面返回传参 | 支持 | 支持 |
返回指定路由 | 支持 | 支持 |
页面返回弹窗 | 支持,通过路由拦截实现 | showAlertBeforeBackPage |
路由替换 | replacePath & replacePathByName | replaceUrl & replaceNameRoute |
路由栈清理 | clear | clear |
清理指定路由 | removeByIndexes & removeByName | 不支持 |
转场动画 | 支持 | 支持 |
自定义转场动画 | 支持 | 支持,动画类型受限 |
屏蔽转场动画 | 支持全局和单次 | 支持 设置pageTransition方法duration为0 |
geometryTransition共享元素动画 | 支持(NavDestination之间共享) | 不支持 |
页面生命周期监听 | UIObserver.on('navDestinationUpdate') | UIObserver.on('routerPageUpdate') |
获取页面栈对象 | 支持 | 不支持 |
路由拦截 | 支持通过setInercption做路由拦截 | 不支持 |
路由栈信息查询 | 支持 | getState() & getLength() |
路由栈move操作 | moveToTop & moveIndexToTop | 不支持 |
沉浸式页面 | 支持 | 不支持,需通过window配置 |
设置页面标题栏(titlebar)和工具栏(toolbar) | 支持 | 不支持 |
模态嵌套路由 | 支持 | 不支持 |
作为替代者,我个人认为Navigation 是面向未来的即跨端设备最好的路由方式,其中它解决了目前移动端最头疼的折叠屏的适配方式,当然你也会说解决移动端折叠屏还有其他的方式,但是目前就我所知华为这是最好的方式,下面我们简单的介绍一下Navigation的使用方式,从整个逻辑上来看和Jetpack 的路由也很像。下面详细介绍一下使用的方式:
第一步:首先是在主页面创建对应的容器:
这里红框标红的就是核心代码。有了对应的容器后,即可添加对应的跳转代码。这里我们使用pushPathByName()方法,这里要进行一个区别,就是pushPath 和 pushPathByName方法
对于我们初学者我们只需要关注对应的跳转方式就可以了,这里我的跳转方式如下:
第二步:
这样我们就完成了,需要调整的页面的相关工作,下面我们来看我们需要去的界面的相关配置:
第三步:
我们首页要声明入口的方法这里特别注意,我们的入口方法要和我们的json文件的名称保持一致:
第四步:
我们创建一个router_pages.json 文件,然后完成如下的操作方式:
这样就可以引入我们需要的json文件了,最后我们去json文件里操作。
这里一定要注意:buildFunction这个参数,后面的value一定要和去哪里的那个界面保持一致,不然很容易出现跳转失败的问题。
同样后续的跳转也是类似这样操作。好了一个简单的跳转方式就简单的介绍完了,后面会继续补充,我们对 Navigation的详细理解,包括和主页Tab 之间的处理,还有对代码的封装,如果避免json文件写错的情况导致问题排查的难度,还有如何进行自定义修改官方的UI样式。其他的像跳转动画之类的,我这里建议参考官方文档,官方文档介绍的相当详细。