其实取消请求对于普通的ajax请求rn-fetch-blob写法是比较简单的

 let task = RNFetchBlob.fetch('GET', 'http://example.com/file/1')

 task.then(() => { ... })
// handle request cancelled rejection
.catch((err) => {
console.log(err)
})
// cancel the request, the callback function is optional
task.cancel((err) => { ... })

但是我们的整个应用结合了redux,不可能直接在组件中调用ajax请求,那么我们的action可能是这样的

 export const login = (data) => dispatch => {
//ajax 是我们自己封装的方法,但是底层还是rn-fetch-blob,返回的依然是一个promise
let promise = ajax.post({
url:"/user/login",
data:data
});
//这里返回的payload是只有ajax的数据
promise.then(payload=>{
dispatch({type:"LOGIN_SUCCESS",payload});
});
return promise;
};

每一个action这样干其实很恶心,都要做这样的两个操作,效率没提高,反而多了很多的冗余代码

想了想,干脆自己写个中间件来处理这个吧

当当当当fetch-blob-redux-middleware 诞生

加入fetch-blob-redux-middleware后的action写法:

 //createAction 为第三方的小插件,使用redux-actions 或者 create-action 都可以
export const login = (data) => createAction("LOGIN_SUCCESS",()=> ajax.post({
url:"/user/login",
data:data
}));

是不是简介了很多,写代码速度估计也会快很多,当然在写fetch-blob-redux-middleware的时候我做了兼容处理,也支持以前的普通的ajax调用方法,所以大家放心的用吧

当然大家也可以根据需要自己写redux middleware,很简单的

rn-fetch-blob+redux 取消请求的更多相关文章

  1. fetch发送Form Data请求并携带cookie

    今天我们来说说如何fetch发送Form Data请求并携带cookie,直接进入正题好吧,别问我今天为啥不在开始吹两句了,累到一句牛逼不想吹...... 步骤1: 设置头部,"Conten ...

  2. axios 取消请求的方法

    开发中遇到需要取消请求的功能,,点击终止查询可以取消开始查询请求,再次点击开始查询又可以进行查询. 解决方法:axios官方文档上的CancelToken,一开始用了这个api后,可以成功取消请求,但 ...

  3. jq和axios的取消请求

    场景: 分页: 每次点击分页会发送请求,如果上一次请求还未获取到,下一次请求已经开始且先一步获取到,那么数据上会出现问题. 快速点击会发送多次请求,多次点击的时候一般的做法我们会定义一个flag,此时 ...

  4. axios 取消请求

    解决思路 在发送第二次请求的时候如果第一次请求还未返回,则取消第一次请求,以保证后发送的请求返回的数据不会被先发送的请求覆盖. axios官方文档取消请求说明 方法一: const CancelTok ...

  5. Android OkHttp + Retrofit 取消请求的方法

    本文链接 前言 在某一个界面,用户发起了一个网络请求,因为某种原因用户在网络请求完成前离开了当前界面,比较好的做法是取消这个网络请求.对于OkHttp来说,具体是调用Call的cancel方法. 如何 ...

  6. axios 取消请求 (如:用户登录失效,阻止其他请求)

    const CancelToken = axios.CancelToken; const source = CancelToken.source(); axios.interceptors.reque ...

  7. 学习axios必知必会(2)~axios基本使用、使用axios前必知细节、axios和实例对象区别、拦截器、取消请求

    一.axios的基本使用: ✿ 使用axios前必知细节: 1.axios 函数对象(可以作为axios(config)函数使用去发送请求,也可以作为对象调用方法axios.request(confi ...

  8. Fetch API与POST请求那些事

    简述 相信不少前端开发童鞋与后端联调接口时,都会碰到前端明明已经传了参数,后端童鞋却说没有收到,尤其是post请求,遇到的非常多.本文以node.js作为服务端语言,借用express框架,简要分析客 ...

  9. Volley HTTP库系列教程(2)Volley.newRequestQueue示例,发请求的流程,取消请求

    Sending a Simple Request Previous  Next This lesson teaches you to Add the INTERNET Permission Use n ...

随机推荐

  1. (转载)office 2003 gaozhi.msi 缺失提示问题修复

    某些GHOST版win7,自带office 2003,每次启动word,它都会提示"稿纸没安装"云云,找不到那个文件.可是我搜遍了硬盘,确实没有那个文件.每次都要点取消,这个提示才 ...

  2. 面试官:自己搭建过vue开发环境吗?

    开篇 前段时间,看到群里一些小伙伴面试的时候被面试官问到这类题目.平时大家开发vue项目的时候,相信大部分人都是使用 vue-cli脚手架生成的项目架构,然后 npm run install 安装依赖 ...

  3. World Wind Java开发之五——读取本地shp文件(转)

    http://blog.csdn.net/giser_whu/article/details/41484433 World Wind Java 使用IconLayer图层类表现点和多点数据,使用Ren ...

  4. POJ-2226 Muddy Fields---二分图匹配+巧妙构图

    题目链接: https://vjudge.net/problem/POJ-2226 题目大意: 用宽度为1长度不限的木板将水洼‘*’盖住而不盖住草‘.' Sample Input 4 4 *.*. . ...

  5. PostgreSql的使用

    title: PostgreSql的使用 tags: PostgreSql --- PostgreSql官网: https://www.postgresql.org/ 1 PostgreSql的安装 ...

  6. Windows下配置Jmeter环境变量

    一.安装SDK 1.下载并安装sdk,安装目录为D:\Program Files (x86)\Java\jdk1.7.0_01 2.配置环境变量 1)新建系统变量:JAVA_HOME = D:\Pro ...

  7. java设计模式——原型模式

    一. 定义与类型 定义:指原型实例指定创建对象的种类,并且通过拷贝这些原型创建新的对象.不需要知道任何创建的细节,不调用构造函数 类型:创建型 二.使用场景 类初始化消耗较多资源 new 产生的一个对 ...

  8. Java源码——HashMap的源码分析及原理学习记录

    学习HashMap时,需要带着这几个问题去,会有很大的收获: 一.什么是哈希表 二.HashMap实现原理 三.为何HashMap的数组长度一定是2的次幂? 四.重写equals方法需同时重写hash ...

  9. Oracle表连接学习笔记

    目录 一.表连接类型 1.1 内连接 1.2 外连接 二.表连接方法 2.1 表连接方法分类 2.2 表连接方法特性区别 @ 一.表连接类型 表连接类型可以分为:内连接.外连接,在看<收获,不止 ...

  10. 井字游戏 人机对战 java实现

    package com.ecnu.Main; /** * 主函数触发游戏 */public class MainApplication { public static void main(String ...