前言

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

  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 来实现取消。

Flutter中如何取消任务的更多相关文章

  1. 在Flutter中嵌入Native组件的正确姿势是...

    引言 在漫长的从Native向Flutter过渡的混合工程时期,要想平滑地过渡,在Flutter中使用Native中较为完善的控件会是一个很好的选择.本文希望向大家介绍AndroidView的使用方式 ...

  2. 从零学习Fluter(五):Flutter中手势滑动拖动已经网络请求

    从六号开始搞Flutter,到今天写这篇blog已经过了4天时间,文档初步浏览了一遍,写下了这个demo.demo源码分享在github上,现在对flutter有种说不出的喜欢了.大家一起搞吧! 废话 ...

  3. Flutter 中 JSON 解析

    本文介绍一下Flutter中如何进行json数据的解析.在移动端开发中,请求服务端返回json数据并解析是一个很常见的使用场景.Android原生开发中,有GsonFormat这样的神器,一键生成Ja ...

  4. mvp 在 flutter 中的应用

    在 Android 应用程序开发过程中,我们经常会用到一些所谓的架构方法,如:mvp,mvvm,clean等.之所以这些方法会被推崇是因为他们可以大大的解耦我们的代码的功能模块,让我们的代码在项目中后 ...

  5. Flutter 中文文档网站 flutter.cn 正式发布!

    在通常的对 Flutter 介绍中,最耳熟能详的是下面四个特点: 精美 (Beautiful):充分的赋予和发挥设计师的创造力和想象力,让你真正掌控屏幕上的每一个像素. ** 极速 (Fast)**: ...

  6. 理解 Flutter 中的 Key

    概览 在 Flutter 中,大概大家都知道如何更新界面视图: 通过修改 Stata 去触发 Widget 重建,触发和更新的操作是 Flutter 框架做的. 但是有时即使修改了 State,Flu ...

  7. flutter 中的样式

    flutter 中的样式 样式 值 width 320.0 height 240.0 color Colors.white,Colors.grey[300] textAlign TextAlign.c ...

  8. flutter中的异步机制Future

    饿补一下Flutter中Http请求的异步操作. Dart是一个单线程语言,可以理解成物理线路中的串联,当其遇到有延迟的运算(比如IO操作.延时执行)时,线程中按顺序执行的运算就会阻塞,用户就会感觉到 ...

  9. Flutter中管理路由栈的方法和应用

    原文地址:https://www.jianshu.com/p/5df089d360e4 本文首先讲的Flutter中的路由,然后主要讲下Flutter中栈管理的几种方法. 了解下Route和Navig ...

  10. Flutter 中的路由

    Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航. 并提供了管理堆栈的方法.如:Navigator.push 和 Navigator.po ...

随机推荐

  1. 4组-Beta冲刺-5/5

    一.基本情况 队名:摸鲨鱼小队 组长博客:https://www.cnblogs.com/smallgrape/p/15608986.html github链接:https://github.com/ ...

  2. js 复制链接内容

    <script type="text/javascript">//复制活动地址 function shareUrl(id) { var url = 'http://H5 ...

  3. P1138 第 k 小整数

    P1138 第 k 小整数 - 洛谷 | 计算机科学教育新生态 (luogu.com.cn) dalao 勿喷,适合新手 思路就是排序加查重,最后判断第k小数.思路十分简单. 刚开始我一直想二维循环查 ...

  4. springboot项目启动报错:找不到或无法加载主类 com....

    springboot项目报错 找不到或无法加载主类 com.... 1.如果是导入的别人的项目 首先要配置好JDK 和 MAVEN 然后点击右侧栏的maven图标 --->点击clean(清除掉 ...

  5. FII-PRA006/010开发板硬件实验一

    FII-PRA006/010开发板硬件实验一 以一位全加器为例介绍如何利用开发板进行板载实验.一位全加器的Verilog代码如下: 1 2 3 4 5 6 7 8 9 10 module fadd1 ...

  6. css cursor: url() 使用火狐浏览器问题,鼠标没有效果

    在火狐浏览器问题使用cursor: url():鼠标没有效果,需要给使用标签添加一个height

  7. Web_Servlet四大域对象

    保存数据的对象作用于从大到小: ServletContext -- 保存数据到web项目中 Session(会话对象)  -- Request -- 保存当前请求(链),有转发就保存包括转发的数据 P ...

  8. JavaWeb学习--EL表达式

    一.EL表达式: 1.命令表达式: ${作用域对象别名.共享数据} 2.命令作用: 1)EL表达式是EL工具包提供一种特殊命令格式[表达式命令格式] 2)EL表达式在JSP文件上使用 3)负责在JSP ...

  9. (二).JavaScript的运算符和表达式,数据类型转化

    4. 运算符和表达式 4.3 赋值运算符和表达式 1.赋值运算符 = 作用:赋值运算符就是将右边的内容赋值给左边的变量或属性. var result = 1 + 2; 2.复合赋值运算符 +=,-=, ...

  10. C/C++ 异常处理机制(例:文件拷贝)

    异常是一种程序控制机制,与函数机制互补. 函数是一种以栈结构展开的上下函数衔接的程序控制系统,异常是另一种控制结构,它可以在出现"意外"时中断当前函数,并以某种机制(类型匹配)回馈 ...