学做网页的网站谷歌关键词工具
在Flutter 实际开发过程中，页面数据往往是异步加载，接口请求回来后，数据刷新显示到界面上。
由于Flutter性能原因，也可能因为获取数据量比较大，在新页面路由进场动画执行过程中，接口请求结果回来了，很可能在进场动画执行过程中，刷新界面，导致进场动画卡顿。
那可不可以实现在路由进场完成后，再去请求数据，刷新界面呢，很遗憾官方没有类似的监听，官方提供的路由状态监听，是在调用push切换路由时，立即生效，和我们的期望不一致。
在查看了Flutter 源码，发现了一个取巧的方案，提供给大家。
直接上源码
/// @author bawomingtian
/// @date 2023/10/16
/// @desc 通过监听路由入场动画完成，判断路由完全进入，可以用来优化在进场动画执行过程中
/// 异步请求数据刷新界面，导致进场动画卡顿的问题
class AsyncState<T extends StatefulWidget> extends State<T> {Completer<bool> resumeCompleter = Completer();@overridevoid didChangeDependencies() {ModalRoute.of(context)!.controller?.addStatusListener((status) {if(status==AnimationStatus.completed){initAsyncLoad();}});super.didChangeDependencies();}///子类可以在initState 请求接口///该方法主要目的为：路由动画执行结束后，再返回结果///可以提前预加载数据，加快内容显示Future<dynamic> asyncWaitResume(Future<dynamic> future) async {var value = await Future.wait([future,resumeCompleter.future]);return value.first;}///入场路由动画执行完成，新入场页面完全进入void initAsyncLoad(){resumeCompleter.complete(true);}@overrideWidget build(BuildContext context) {return const SizedBox();}
}原理很简单，通过监听入场动画的状态来判断路由状态
下面贴一下使用方法
class _TestState extends AsyncState<Object> {......@overridevoid initState() {WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {asyncWaitResume(loadUserList()).then((value){......});});super.initState();}@overrideWidget build(BuildContext context) {......}这样可以很方便的请求接口刷新界面，不用担心入场动画卡顿