一 概述

• GetPage Middleware中間件介紹
• 如何定義GetMiddleware
• GetPage Middleware使用示例

二 GetPage Middleware中間件介紹

2.1 什么是Middleware中間件

• 中間件是介于應用系統和系統軟件之間的一類軟件，它使用系統軟件所提供的基礎服務（功能），銜接網絡上應用系統的各個部分或不同的應用，能夠達到資源共享、功能共享的目的百度百科
• 此處指：執行路由跳轉前的頁面，比如Get.to()跳轉之前的那個頁面

2.2 GetPage Middleware在那里配置

void main() => runApp(GetMaterialApp(
      getPages: [
        GetPage(
            name: '/home',
            page: () => HomeWidget(),
            middlewares: [GetMiddleware(priority: 1), GetMiddleware(priority: 2)])
      ],
    ));

說明：

• 在main.dart中的GetMaterialApp/getPages/GetPage進行配置
• middlewares是個數組，可配置多個，并且有優先級
• middlewares的配置，在要跳轉的頁面進行配置，不是跳轉前頁面配置

三 如何定義GetMiddleware

3.1 定義一個類繼承GetMiddleware

class MiddleWare1 extends GetMiddleware {}

3.2 設置優先級priority

class MiddleWare1 extends GetMiddleware {
  @override
  // TODO: implement priority
  int? get priority => -1;
 } 

說明：優先級越低越先執行

3.3 重寫GetMiddleware中的幾個方法

class MiddleWare1 extends GetMiddleware {
  @override
  // TODO: implement priority
  int? get priority => -1;
  //重定向，當正在搜索被調用路由的頁面時，將調用該函數
  @override
  RouteSettings? redirect(String? route) {
    print('redirect1----');
    //return super.redirect(route);
    return const RouteSettings(name: AppRoutes.login);
  }

//創建任何內容之前調用此函數
  @override
  GetPage? onPageCalled(GetPage? page) {
    print('onPageCalled1----');
    //return super.onPageCalled(page);
    //return page?.copy(name: AppRoutes.login);
    return GetPage(name: AppRoutes.login, page: () => LoginWidget());
  }

  //這個函數將在綁定初始化之前被調用。在這里您可以更改此頁面的綁定。
  @override
  List? onBindingsStart(List? bindings) {
    print('onBindingsStart1----');
    //return super.onBindingsStart(bindings);
    bindings?.add(LoginBinding());
    return bindings;
  }

//此函數將在綁定初始化后立即調用。在這里，您可以在創建綁定之后和創建頁面小部件之前執行一些操作
  @override
  GetPageBuilder? onPageBuildStart(GetPageBuilder? page) {
    print('onPageBuildStart1----');
    //return super.onPageBuildStart(page);
    return page;
  }

  //該函數將在調用 GetPage.page 函數后立即調用，并為您提供函數的結果。并獲取將顯示的小部件
  @override
  Widget onPageBuilt(Widget page) {
    print('onPageBuilt1 ----');
    //return super.onPageBuilt(page);
    return page;
  }

//此函數將在處理完頁面的所有相關對象（控制器、視圖等）后立即調用
  @override
  void onPageDispose() {
    print('onPageDispose1 ----');
    super.onPageDispose();
  }
}

說明：

• RouteSettings? redirect：搜索路由進行重定向時執行此方法，比如Get.to()
• GetPage? onPageCalled：跳轉到到頁面顯示執行此方法，通過page?.copy(name: AppRoutes.login)或者GetPage(name: AppRoutes.login, page: () => LoginWidget())顯示頁面
• List? onBindingsStart：頁面顯示綁定初始化調用位置
• GetPageBuilder? onPageBuildStart：綁定初始化后立即調用位置
• Widget onPageBuilt：返回GetPage.page的頁面
• void onPageDispose()：頁面處理完調用函數位置

四 GetPage Middleware使用示例

4.1 效果圖說明

跳轉頁面	要跳轉到頁面	中間件1(優先度)	中間件2(優先度)

說明：

• 在Me界面，點擊切換路由—Detail按鈕
• 如果沒有中間件，點擊此按鈕，會跳轉到Detail界面
• 設置了middlewares，如果優先級為Login的Middle，則顯示Login界面
• 設置了middlewares，如果優先級為Other的Middle，則顯示Other界面

4.2 代碼示例

main中的routes

  static final List routes = [
    GetPage(
      name: AppRoutes.main,
      page: () => IndexWidget(),
      binding: IndexBinding(),
    ),
    GetPage(
        name: AppRoutes.login,
        page: () => LoginWidget(),
        binding: LoginBinding()),
    GetPage(
      name: AppRoutes.detail,
      page: () => DetailWidget(),
      middlewares: [MiddleWare1(), MiddleWare2()],
    ),
    GetPage(name: AppRoutes.other, page: () => OtherWidget())
  ];

說明：在Detail設置middlewares，用于攔截中間件

MeWidget界面中的點擊按鈕

class MeWidget extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Center(child: Column(children: [
      Text('Me'),
      RaisedButton(child: Text("切換路由-Detail"),onPressed: ()=>{Get.toNamed(AppRoutes.detail)})
    ],));
  }
}

說明：此處的路由搜索為detail，執行方法為Get.toName

自定義MiddleWare1

class MiddleWare1 extends GetMiddleware {
  @override
  // TODO: implement priority
  int? get priority => -1;
  //重定向
  @override
  RouteSettings? redirect(String? route) {
    print('redirect1----');
    //return super.redirect(route);
    return const RouteSettings(name: AppRoutes.login);
  }

//創建任何內容之前調用此函數
  @override
  GetPage? onPageCalled(GetPage? page) {
    print('onPageCalled1----');
    //return super.onPageCalled(page);
    //return page?.copy(name: AppRoutes.login);
    return GetPage(name: AppRoutes.login, page: () => LoginWidget());
  }

  //這個函數將在綁定初始化之前被調用。在這里您可以更改此頁面的綁定。
  @override
  List? onBindingsStart(List? bindings) {
    print('onBindingsStart1----');
    //return super.onBindingsStart(bindings);
    bindings?.add(LoginBinding());
    return bindings;
  }

//此函數將在綁定初始化后立即調用。在這里，您可以在創建綁定之后和創建頁面小部件之前執行一些操作
  @override
  GetPageBuilder? onPageBuildStart(GetPageBuilder? page) {
    print('onPageBuildStart1----');
    //return super.onPageBuildStart(page);
    return page;
  }

  //該函數將在調用 GetPage.page 函數后立即調用，并為您提供函數的結果。并獲取將顯示的小部件
  @override
  Widget onPageBuilt(Widget page) {
    print('onPageBuilt1 ----');
    //return super.onPageBuilt(page);
    return page;
  }

//此函數將在處理完頁面的所有相關對象（控制器、視圖等）后立即調用
  @override
  void onPageDispose() {
    print('onPageDispose1 ----');
    super.onPageDispose();
  }
}

自定義MiddleWare2

class MiddleWare2 extends GetMiddleware{

  @override
  // TODO: implement priority
  int? get priority =>-2;
  //重定向
  @override
  RouteSettings? redirect(String? route) {
    print('redirect2----');
    //return super.redirect(route);
    return const RouteSettings(name: AppRoutes.other );
  }

  //onPageCalled
  @override
  GetPage? onPageCalled(GetPage? page) {
    print('onPageCalled2----');
    //return super.onPageCalled(page);
    return page?.copy(name: AppRoutes.other);
    //return GetPage(name: AppRoutes.other, page:()=> OtherWidget());
  }
  //onBindingsStart
  @override
  List? onBindingsStart(List? bindings) {
    print('onBindingsStart2----');
    //return super.onBindingsStart(bindings);
    return bindings;
  }
  //onPageBuildStart
  @override
  GetPageBuilder? onPageBuildStart(GetPageBuilder? page) {
    print('onPageBuildStart2----');
    return super.onPageBuildStart(page);
  }
  //onPageBuilt
  @override
  Widget onPageBuilt(Widget page) {
    print('onPageBuilt2 ----');
    return super.onPageBuilt(page);
  }
  //onPageDispose
  @override
  void onPageDispose() {
    print('onPageDispose2 ----');
    super.onPageDispose();
  }

}

五 參考

• Github-getX-GetPage Middleware-官方文檔
• CSDN下載-參考代碼