GetX 踩坑之移除路由栈中的某个页面

踩坑

在业务需求中需要在特定页面移除之前的某个页面，比如有这样一个路由栈。A->B->C->D->E。此时想在E界面移除页面C。在网上搜索了一下相关实现，并没有太多好的办法，有的话也入寝比较高。于是按照自己的理解实现了一个解决办法。

第一步
首先我们自定义一个RouteObserver 来监听路由变化并在内部实现删除置顶页面功能。

import 'package:flutter/material.dart';
import 'package:get/get.dart';

// app路由监听
class AppRoutesObserver extends RouteObserver {
  final List<Route> _appRoutes = [];

  @override
  void didPush(Route route, Route? previousRoute) {
    super.didPush(route, previousRoute);
    _appRoutes.insert(0, route);
  }

  @override
  void didPop(Route route, Route? previousRoute) {
    super.didPop(route, previousRoute);
    _appRoutes.remove(route);
  }

  // 移除指定路由页面
  Future removeRoute<S extends GetxController>(String routeName) async {
    // 如果弹出的不是广告占位页面则移除
    for (Route route in _appRoutes) {
      if (route.settings.name == null) {
        continue;
      }
      Uri? url = Uri.tryParse(route.settings.name!);
      if (url != null && url.path == routeName) {
        _appRoutes.remove(route);
        // 从路由栈中移除
        Get.removeRoute(route);
        // 移除controller
        await Get.delete<S>(force: true);
        break;
      }
    }
  }
}

应该也可以通过Get来获取路由栈信息。

第二部
在main.dart中的GetMaterialApp 中的navigatorObservers 加入AppRoutesObserver 注意把AppRoutesObserver定义成全局的，这样在需要删除中间页面时直接使用该类的removeRoute即可，注意在调用方式传入controller范型参数来删除对于的controller。