前言
- 源码：https://gitee.com/common-apps/ZRouter
- OH：https://ohpm.openharmony.cn/#/cn/detail/@hzw%2Fzrouter
基本使用
在介绍基本使用的流程中，我们知道每个子页面都需要通过NavDestination来包裹，这样会造成代码的冗余，因此我们可通过ZRouter的模板化能力将NavDestination层去除。
在ZRouter和编译插件1.2.0版本开始支持NavDestination页面模板化，是一个可选项非强制性要求的功能，由开发者自由选择。
在Route或ZRoute注解中设置useTemplate属性为true，代码示例如下：
@ZRoute({ name: RouterConstants.CUSTOM_COMPONENT_CHILD_VIEW, useTemplate: true, title: "NavDest模板化案例" })
@Component
export struct ChildView {build(){Column({ space: 15 }) {...}}
}
这样就完成页面的跳转。
ZRouter.getInstance().navigation(RouterConstants.CUSTOM_COMPONENT_CHILD_VIEW)
生命周期函数管理
提供了两种方式来监听NavDestination页面的生命周期函数。
- 继承于ZLifecycleObserver类实现生命周期函数，@ZLifecycle注解声明；
- 通过ZRouter的addLifecycleObserver()静态方法设置监听。
第一种方式，新建一个类继承ZLifecycleObserver，并用@ZLifecycle注解声明，其name属性是路由名称 ，代码示例：
@ZLifecycle({ name: RouterConstants.CUSTOM_COMPONENT_CHILD_VIEW })
@Observed
export class CustomCompLifecycleObserver extends ZLifecycleObserver {counter = 0onReady(context: NavDestinationContext): void {}onBackPress(): boolean {return false}onShown(info: RouterInfo): void {}onHidden(info: RouterInfo): void {}
}
在NavDestination页面的内容ChildView子组件中，可以通过@Consume来获取其实例，代码如下：
@Route({ name: RouterConstants.CUSTOM_COMPONENT_CHILD_VIEW, useTemplate: true, title: "NavDest模板化案例" })
@Component
export struct ChildView {// 通过@Consume获取生命周期观察者实例@Consume lifecycleObserver: CustomCompLifecycleObserverbuild(){Column({ space: 15 }) {...}} }
第二种方式，在ChildView子组件的aboutToAppear()方法中通过ZRouter的addLifecycleObserver()静态方法设置监听 代码示例：
aboutToAppear(): void {// 设置NavDest模板页面的生命周期监听ZRouter.addLifecycleObserver((state, router) => {console.log("ChildView CustomComponentView ", state, router?.navDestinationId)if (state === LifecycleState.ON_BACK_PRESS) {// 拦截返回事件，与可以在lifecycleObserver做拦截处理if (Date.now() - this.lastBackTime < 2000 || this.lastBackTime === 0) {if (Date.now() - this.lastBackTime < 2000 ) {return false}this.lastBackTime = Date.now()ToastUtils.show("再按一次退出")return true}return false}return false})}
如果你监听返回事件时需要返回布尔值，其他状态则不需要设置返回值。
自定义NavDestination属性
新建一个类继承于ZAttributeModifier，并且用 @ZAttribute 注解声明属于哪个页面的。代码示例：
@ZAttribute({ name: RouterConstants.CUSTOM_COMPONENT_CHILD_VIEW })
export class CustomAttributeModifier extends ZAttributeModifier {initModifier(instance: NavDestinationModifier): void {instance.hideTitleBar(false)instance.mode(NavDestinationMode.STANDARD)}}到此就完成了NavDestination页面模板化的能力，其中生命周期函数监听和自定义NavDestination属性是可选的，当前NavDestination页面模板化暂时不支持设置转场动画，后续会接入集成进去。
其他
- 鸿蒙ZRouter动态路由框架—生命周期函数管理
- 鸿蒙ZRouter动态路由框架—服务路由