【開源三方庫】Arouter：一款輕量、高效的頁面路由工具

點擊藍(lán)字 ╳ 關(guān)注我們

開源項目 OpenHarmony是每個人的 OpenHarmony

孫澳

OpenHarmony知識體系組

簡介

Arouter是一款適用于OpenAtom OpenHarmony（以下簡稱“OpenHarmony”）的輕量高效的頁面路由工具，相比原生的路由方案，Arouter更有優(yōu)勢。傳統(tǒng)的路由方案使用顯示Intent和隱式Intent進(jìn)行跳轉(zhuǎn)，會存在一些問題。使用顯式Intent耦合度過高，而使用隱式Intent集中式管理Path會導(dǎo)致協(xié)作困難。Arouter采用自定義的路由方案，通過解析標(biāo)準(zhǔn)URL進(jìn)行跳轉(zhuǎn)，避免了直接依賴的問題。使用分布式管理頁面配置，解決了集中式管理Path的問題，整個路由跳轉(zhuǎn)過程更加透明，具有更好的擴(kuò)展性。Arouter相比原生路由方案，具有更低的耦合度、更好的協(xié)作性和控制攔截能力，同時采用分布式管理頁面配置，提供了更好的擴(kuò)展性，目前支持SDK：OpenHarmony API Version 10版本。

效果圖

?

使用說明

Arouter支持以下功能：

●支持頁面間路由跳轉(zhuǎn)；

●支持帶參數(shù)跳轉(zhuǎn)及回調(diào)；

●支持配置跳轉(zhuǎn)攔截器；

●支持預(yù)處理跳轉(zhuǎn)與否；

路由跳轉(zhuǎn)

1.不傳參跳轉(zhuǎn)通過Arouter.getInstance()創(chuàng)建路由對象，使用鏈?zhǔn)秸{(diào)用方法 build('')配置跳轉(zhuǎn)的頁面，navigation() 方法進(jìn)行頁面跳轉(zhuǎn)。

import {Arouter} from "@ohos/arouteronactivityresult";
Arouter.getInstance()    
 .build("--/--")  //需要跳轉(zhuǎn)的地址    
 .navigation()

2.傳參跳轉(zhuǎn)在不傳參跳轉(zhuǎn)的基礎(chǔ)上，跳轉(zhuǎn)之前通過withParams()進(jìn)行參數(shù)配置。

import {Arouter} from "@ohos/arouteronactivityresult";
Arouter.getInstance()    
 .build("--/--")  //需要跳轉(zhuǎn)的地址    
 .withParams({index:"--"})    
.navigation()

3.路由回調(diào)路由回調(diào)需要配合NavigationCallback接口進(jìn)行，在路由前的頁面實現(xiàn)NavigationCallback接口

import {NavigationCallback} from '@ohos/arouteronactivityresult'
var callback:NavigationCallback = {    
 onInterrupt(postcard){},    
 onArrival(postcard){},    
 onActivityResult(data){}
}

然后將callback傳入 .navigationWithCallback()中進(jìn)行跳轉(zhuǎn)

import {Arouter} from "@ohos/arouteronactivityresult";
Arouter.getInstance()    
 .build("--")//需要跳轉(zhuǎn)的地址    
.navigationWithCallback(callback)

在目標(biāo)頁面的onPageShow()生命周期中調(diào)用getPostcard()方法獲取到指定的postcard

import router from '@ohos.router';
if (postcard == null) { 
 postcard =  Arouter.getInstance().getPostcard(router.getState().path+router.getState().name);   
}

使用 postcard.getNavigationCallback() 方法調(diào)用對應(yīng)的回調(diào)方法,即可回調(diào)源頁面實現(xiàn)的方法

postcard.getNavigationCallback().onActivityResult(params)

路由攔截

1.配置攔截器在攔截器中的process()方法中實現(xiàn)頁面的攔截，通過interceptorCallback.onInterrupt()中斷跳轉(zhuǎn)，interceptorCallback.onContinue()繼續(xù)跳轉(zhuǎn)。

import {Postcard,IInterceptor,InterceptorCallback} from '@ohos/arouteronactivityresult';
var iInterceptor:IInterceptor= {
    process(postcard:Postcard, interceptorCallback:InterceptorCallback) {
        // 選擇攔截的頁面,若跳轉(zhuǎn)時有該路徑則進(jìn)行攔截提示，若沒有則直接跳轉(zhuǎn)
        if (Postcard.getUri() == 'pages/transit') {
            // 選擇彈框
            AlertDialog.show(
                {
                    message: '被攔截了，點擊繼續(xù)跳轉(zhuǎn)',
                    primaryButton: {
                        value: '取消',
                        action: () => {
                            // 中斷跳轉(zhuǎn)
                         interceptorCallback.onInterrupt(postcard)
                        }
                    },
                    secondaryButton: {
                        value: '繼續(xù)',
                        action: () => {
                            // 繼續(xù)跳轉(zhuǎn)
                        interceptorCallback.onContinue(postcard);
                        }
                    },
                }
            )
        } else {
            // 繼續(xù)跳轉(zhuǎn)
            interceptorCallback.onContinue(postcard);
        }
    }
}

2.注冊攔截器

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

3.移除攔截器

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

4.配置綠色通道在跳轉(zhuǎn)前使用.setGreenChannel()方法跳過攔截(true:跳過攔截)。

Arouter.getInstance()
    .build("--/--")//需要跳轉(zhuǎn)的地址
    .setGreenChannel(true)
.navigation()

5.配置預(yù)處理跳轉(zhuǎn)與否預(yù)處理:實現(xiàn) PretreatmentService 接口中 onPretreatment 方法，并返回一個Boolean值(true:繼續(xù)跳轉(zhuǎn),false:不跳轉(zhuǎn))。

import {PretreatmentService} from '@ohos/arouteronactivityresult';
var pretreatmentService:PretreatmentService = {
  onPretreatment(postcardboolean{
    return true
  }
}

在跳轉(zhuǎn)前調(diào)用.setPretreatmentService() 方法，將 pretreatmentService傳入 setPretreatmentService()方法中完成預(yù)處理功能。

Arouter.getInstance()
    .build(this.router)
    .setPretreatmentService(pretreatmentService)
.navigationWithCallback(callback)

接口說明

Arouter ?回調(diào)接口 ?

下載安裝

ohpminstall@ohos/arouteronactivityresult

源碼鏈接

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