• Lv0
    粉丝0

积分8 / 贡献0

提问0答案被采纳0文章1

作者动态

    [经验分享] 【开源三方库】Arouter:一款轻量、高效的页面路由工具

    sunao 显示全部楼层 发表于 2024-7-2 15:14:05

    简介

      Arouter是一款适用于OpenAtom OpenHarmony(以下简称“OpenHarmony”)的轻量高效的页面路由工具,相比原生的路由方案,Arouter更有优势。传统的路由方案使用显示Intent和隐式Intent进行跳转,会存在一些问题。使用显式Intent耦合度过高,而使用隐式Intent集中式管理Path会导致协作困难。Arouter采用自定义的路由方案,通过解析标准URL进行跳转,避免了直接依赖的问题。使用分布式管理页面配置,解决了集中式管理Path的问题,整个路由跳转过程更加透明,具有更好的扩展性。

    Arouter相比原生路由方案,具有更低的耦合度、更好的协作性和控制拦截能力,同时采用分布式管理页面配置,提供了更好的扩展性,目前支持SDK:OpenHarmony API Version 10版本。

    使用说明

    Arouter支持以下功能:

                 ● 支持页面间路由跳转;
    
                 ● 支持带参数跳转及回调;
    
                 ● 支持配置跳转拦截器;
    
                 ● 支持预处理跳转与否;

    路由跳转

    1. 不传参跳转

       通过Arouter.getInstance()创建路由对象,使用链式调用方法 build('')配置跳转的页面,navigation() 方法进行页面跳转。
    import {Arouter} from "@ohos/arouteronactivityresult";
    Arouter.getInstance()  
     .build("--/--")  //需要跳转的地址  
     .navigation()

    2.传参跳转

      在不传参跳转的基础上,跳转之前通过withParams()进行参数配置。
    import {Arouter} from "@ohos/arouteronactivityresult";
    Arouter.getInstance()  
     .build("--/--")  //需要跳转的地址  
     .withParams({index:"--"})  
     .navigation()

    3.路由回调

      路由回调需要配合NavigationCallback接口进行,在路由前的页面实现NavigationCallback接口
    import {NavigationCallback} from '@ohos/arouteronactivityresult'
    var callback:NavigationCallback = {  
     onInterrupt(postcard){},  
     onArrival(postcard){},  
     onActivityResult(data){}
    }
      然后将callback传入 .navigationWithCallback()中进行跳转
    import {Arouter} from "@ohos/arouteronactivityresult";
    Arouter.getInstance()  
     .build("--")//需要跳转的地址  
     .navigationWithCallback(callback)
      在目标页面的onPageShow()生命周期中调用getPostcard()方法获取到指定的postcard
    import router from '@ohos.router';
    if (postcard == null) { 
     postcard =  Arouter.getInstance().getPostcard(router.getState().path+router.getState().name);   
    }
      使用 postcard.getNavigationCallback() 方法调用对应的回调方法,即可回调源页面实现的方法
    postcard.getNavigationCallback().onActivityResult(params)

    路由拦截

    1.配置拦截器

      在拦截器中的process()方法中实现页面的拦截,通过interceptorCallback.onInterrupt()中断跳转,interceptorCallback.onContinue()继续跳转。
    import {Postcard,IInterceptor,InterceptorCallback} from '@ohos/arouteronactivityresult';
    var iInterceptor:IInterceptor= {
        process(postcard:Postcard, interceptorCallback:InterceptorCallback) {
            // 选择拦截的页面,若跳转时有该路径则进行拦截提示,若没有则直接跳转
            if (Postcard.getUri() == 'pages/transit') {
                // 选择弹框
                AlertDialog.show(
                    {
                        message: '被拦截了,点击继续跳转',
                        primaryButton: {
                            value: '取消',
                            action: () => {
                                // 中断跳转
                             interceptorCallback.onInterrupt(postcard)
                            }
                        },
                        secondaryButton: {
                            value: '继续',
                            action: () => {
                                // 继续跳转
                            interceptorCallback.onContinue(postcard);
                            }
                        },
                    }
                )
            } else {
                // 继续跳转
                interceptorCallback.onContinue(postcard);
            }
        }
    }

    2.注册拦截器

    import {registerInterceptor} from '@ohos/arouteronactivityresult';
    registerInterceptor(iInterceptor);

    3. 移除拦截器

    import {unregisterInterceptor} from '@ohos/arouteronactivityresult';
    unregisterInterceptor()

    4.配置绿色通道

      在跳转前使用.setGreenChannel()方法跳过拦截(true:跳过拦截)。
    Arouter.getInstance()
        .build("--/--")//需要跳转的地址
        .setGreenChannel(true)
        .navigation()

    5.配置预处理跳转与否

      预处理:实现 PretreatmentService 接口中 onPretreatment 方法,并返回一个Boolean值(true:继续跳转,false:不跳转)。
    import {PretreatmentService} from '@ohos/arouteronactivityresult';
    var pretreatmentService:PretreatmentService = {
      onPretreatment(postcard:Postcard):boolean{
        return true
      }
    }
      在跳转前调用.setPretreatmentService() 方法,将 pretreatmentService传入 setPretreatmentService()方法中完成预处理功能。
    Arouter.getInstance()
        .build(this.router)
        .setPretreatmentService(pretreatmentService)
        .navigationWithCallback(callback)

    接口说明

    Arouter

    方法名 入参 接口描述
    build string 配置页面跳转路径
    withParams { } 传入另一页面的参数
    navigation 正常跳转
    navigationWithCallback NavigationCallback 带回调跳转
    setGreenChannel boolean 配置是否为绿色通道
    registerInterceptor iInterceptor 注册拦截器
    unregisterInterceptor 移除拦截器
    getNavigationCallback 获取状态回调方法
    setUri string 设置页面跳转路径
    getUri 获取跳转的页面路径
    getParams 获取跳转传递的参数
    getTag 获取标签
    setTag { } 设置标签
    withFlags boolean 设置flags
    getFlags boolean 获得flags
    toString 导出字符串
    setPretreatmentService PretreatmentService 预处理
    getPostcard 页面路径 找到指定的postcard

    回调接口

    接口名 入参 接口描述
    NavigationCallback.onArrival Postcard 到达回调地
    NavigationCallback.onInterrupt Postcard 回调中断
    NavigationCallback.onActivityResult any 回调结果
    IInterceptor.process Postcard,InterceptorCallback 拦截过程
    InterceptorCallback.onContinue Postcard 拦截器回调继续
    InterceptorCallback.onInterrupt Postcard 拦截器回调暂停
    PretreatmentService.onPretreatment Postcard 预处理实现

    下载安装

    ohpm install @ohos/arouteronactivityresult

    OpenHarmony ohpm 环境配置等更多内容,请参如何安装 OpenHarmony ohpm 包

    源码链接

    https://gitee.com/openharmony-tpc/arouter-api-onActivityResult

    ©著作权归作者所有,转载或内容合作请联系作者

    您尚未登录,无法参与评论,登录后可以:
    参与开源共建问题交流
    认同或收藏高质量问答
    获取积分成为开源共建先驱

    精彩评论1

    汐之蓝

    沙发 发表于 2024-7-18 10:03:23
    学习了

    Copyright   ©2023  OpenHarmony开发者论坛  京ICP备2020036654号-3 |技术支持 Discuz!

    返回顶部