Flutter中如何取消任务

前言

在开发过程中,取消需求是很常见的,但很容易被忽略。然而,取消需求的好处也很大。例如,在页面中会发送很多请求。如果页面被切走并处于不可见状态,就需要取消未完成的请求任务。如果未及时取消,则可能会导致以下负面影响:

  1. 消耗用户额外数据流量。
  2. 任务回调持有全局上下文变量,未及时释放存在内存泄漏风险
  3. 异步请求过多消耗大量系统资源,拖慢 UI 线程,造成卡顿。

在 Flutter 中,如何取消已经在进行的任务呢?首先需要掌握一些基础知识.

前置知识

Future#any 方法

传入一个 Future 任务列表,返回第一个完成的异步任务,无论成功或失败。

定义

用法

如下 5 个异步任务,代码第五行虽然第二执行,但是最先执行完毕,所以第一个返回,至此整个 Future.any 函数执行完毕。

结果输入如下:

总结

  • Future.any 实际就是一个 Completer,N 个 Future 叠加在一起,谁先完成算谁的。
  • Future.any 可以理解成百米赛跑,其中每个选手就是一个 Future,谁跑最快到终点谁就赢了。

Dio 取消实现解析

dio 版本

dio: dev v5.0.3

git: 67f07b86a0976c14a6e19061563832d92ed6772b

branch: main

如何取消

请求中传入 CancelToken 对象,然后调用 token.cancel 方法即可

复制代码
final cancelToken = CancelToken();
dio.get(url, cancelToken: cancelToken).catchError((DioError err) {
  if (CancelToken.isCancel(err)) {
    print('Request canceled: ${err.message}');
  } else{
    // handle error.
  }
});
// Cancel the requests with "cancelled" message.
token.cancel('cancelled');

流程解析

思路:在实际任务执行前使用 Future.any 函数插入取消任务。如果实际任务没有执行完,就有机会取消它。

如下代码,黄色标注按照步骤来读就行。

总结:CancelToken 就像一个渣男,而 Future.any 则提供了公平竞争的机会。只要妹子还没有交男朋友,渣男就有机会中途得手。

说明

取消任务不仅限于网络请求。任何实际业务中包含不必要的耗时操作都可以通过 Future.any 配合 CancelToken 来实现取消

相关推荐
molihuan3 小时前
最新 spine 4.3 flutter 适配鸿蒙
flutter·动画·harmonyos·鸿蒙·spine
GitLqr4 小时前
StatefulWidget 里的隐形炸弹:为什么不要在 State 类中使用 context.mounted
flutter·面试·dart
恋猫de小郭1 天前
Android R8 为什么可以让 Kotlin 协程提速 2 倍?
android·前端·flutter
杉氧1 天前
弹性滚动的奥秘:在 Flutter 中使用 CustomScrollView 与 Sliver 打造极致流畅列表
android·前端·flutter
张风捷特烈1 天前
Flutter UI 解耦 - 天下大势,合久必分, 分久必合
android·前端·flutter
Patrick_Wilson2 天前
从 React 到 Flutter:写给前端的一张跨端知识地图
前端·flutter·react.js
奎叔2 天前
Flutter 分层架构:从页面堆叠到可演进的业务边界
flutter
奎叔2 天前
Flutter 客户端 Trace 与稳定性治理:从链路追踪到灰度、降级和复盘
flutter
GitLqr2 天前
别被“Flutter 传感器延迟 150ms”带偏了:这可能只是你的实现方式错了
flutter·架构·kotlin
杉氧2 天前
Flutter 像素级还原实战:用 CustomPaint 与 Bezier 曲线手绘精致图针
android·前端·flutter