Flutter 页面切换监听

很多业务场景都需要监听页面切换的操作，比如从 A 页面跳转到 B ，再从 B 返回 A 之后，需要重新刷新下数据。在 Android 里通常是 Activity，iOS 里通常是 ViewController 类，这些都对应用户理解的一个页面，但是 Flutter 里并没有像我们通常理解的页面这个概念，所以初学者刚开始会挺别扭。
Flutter 是通过 Navigator 来组织页面的，有点像前端 React/Vue 里的路由。通常在一个 Flutter 应用中，只有一个 Activity/ViewController ，Flutter 呈现的页面的跳转返回，都只是通过 Navigator 将 Widget 抽象成一个一个用户理解的页面而已。所以 Flutter 页面切换监听，还是需要通过对路由的监听来实现。

1. 根组件里定义 RouteObserver

首先需要在根组件 MaterialApp 里定义一个全局的 RouteObserver 对象：

///定义全局的 routeObserver 对象
final RouteObserver<PageRoute> routeObserver = RouteObserver();

void main() {
  runApp();
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorObservers: [routeObserver],
      ...
    );
  }
}

2. 在页面中订阅路由事件

接着需要在页面中，通过 RouteObserver 订阅路由事件。我们看下其方法签名：

//订阅
void subscribe(RouteAware routeAware, R route) 

//一般有订阅的同时，也会有解绑的函数，防止内存泄漏以及进行资源释放
void unsubscribe(RouteAware routeAware) 

RouteAware 是个什么鬼内，我们查看源码可以知道其是一个抽象类：

abstract class RouteAware {
  ///下一个页面退出返回时触发
  void didPopNext() { }

  ///当前页面进入时触发
  void didPush() { }

  ///当前页面退出时触发
  void didPop() { }

  ///当前页面跳转到下一个页面时触发
  void didPushNext() { }
}

可以看到，这里其实就是页面切换的监听回调了，如果我们需要实现文中开头所讲的业务场景，只需要使用 didPushNext()、didPopNext() 即可。还一个参数 R route 是个什么东西呢？RouteObserver 是个泛型类型，定了类型是 Route<dynamic>，其实就是当前页面所对应的路由对象。

最终，在页面 Widget 的 Stage 类中实现：

/// 一般通过 with 关键来实现，熟悉前端的可能知道 mixin 这个概念，当然你可以通过 implements 关键来实现接口
class _MyPageState extends State<MyPage> with RouteAware {

  //一般在这里进行订阅，不要试图在 initState() 函数中订阅，调用 ModalRoute.of(context) 会发生错误
  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    routeObserver.subscribe(this, ModalRoute.of(context) as PageRoute);
  }

  @override
  void dispose() {
    routeObserver.unsubscribe(this);
    super.dispose();
  }

  void didPopNext() { }

  ///当前页面进入时触发
  void didPush() { }
  void didPop() { }
  void didPushNext() { }

}