rn-fetch-blob+redux 取消请求
其实取消请求对于普通的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 取消请求的更多相关文章
- fetch发送Form Data请求并携带cookie
今天我们来说说如何fetch发送Form Data请求并携带cookie,直接进入正题好吧,别问我今天为啥不在开始吹两句了,累到一句牛逼不想吹...... 步骤1: 设置头部,"Conten ...
- axios 取消请求的方法
开发中遇到需要取消请求的功能,,点击终止查询可以取消开始查询请求,再次点击开始查询又可以进行查询. 解决方法:axios官方文档上的CancelToken,一开始用了这个api后,可以成功取消请求,但 ...
- jq和axios的取消请求
场景: 分页: 每次点击分页会发送请求,如果上一次请求还未获取到,下一次请求已经开始且先一步获取到,那么数据上会出现问题. 快速点击会发送多次请求,多次点击的时候一般的做法我们会定义一个flag,此时 ...
- axios 取消请求
解决思路 在发送第二次请求的时候如果第一次请求还未返回,则取消第一次请求,以保证后发送的请求返回的数据不会被先发送的请求覆盖. axios官方文档取消请求说明 方法一: const CancelTok ...
- Android OkHttp + Retrofit 取消请求的方法
本文链接 前言 在某一个界面,用户发起了一个网络请求,因为某种原因用户在网络请求完成前离开了当前界面,比较好的做法是取消这个网络请求.对于OkHttp来说,具体是调用Call的cancel方法. 如何 ...
- axios 取消请求 (如:用户登录失效,阻止其他请求)
const CancelToken = axios.CancelToken; const source = CancelToken.source(); axios.interceptors.reque ...
- 学习axios必知必会(2)~axios基本使用、使用axios前必知细节、axios和实例对象区别、拦截器、取消请求
一.axios的基本使用: ✿ 使用axios前必知细节: 1.axios 函数对象(可以作为axios(config)函数使用去发送请求,也可以作为对象调用方法axios.request(confi ...
- Fetch API与POST请求那些事
简述 相信不少前端开发童鞋与后端联调接口时,都会碰到前端明明已经传了参数,后端童鞋却说没有收到,尤其是post请求,遇到的非常多.本文以node.js作为服务端语言,借用express框架,简要分析客 ...
- Volley HTTP库系列教程(2)Volley.newRequestQueue示例,发请求的流程,取消请求
Sending a Simple Request Previous Next This lesson teaches you to Add the INTERNET Permission Use n ...
随机推荐
- Ubuntu 16.04 开启休眠功能
因为休眠功能在部分计算机无法正常工作,所以Ubuntu默认是不开启休眠功能. 要想开启休眠功能先进行如下测试: 1.先检查是否有交换分区(swap),如果有确认交换分区至少和实际可用内存一样大. 2. ...
- SharePoint Survey – Custom Action
<?xml version="1.0" encoding="utf-8" ?> <Elements xmlns="http://sc ...
- linux命令 ——目录
开始详细系统的学习linux常用命令,坚持每天一个命令,所以这个系列为每天一个linux命令.学习的主要参考资料为: 1.<鸟哥的linux私房菜> 2.http://codingstan ...
- OpenGL glReadPixels 转成 CImage
本来是一件很简单的事情,就是将View上使用OpenGL画出来的数据生成图片让其实现打印的功能,我们知道MFC提供打印的接口是不支持OpenGL的(至少我不清楚),必须将它转成GDI再画在Print的 ...
- SVN和Git的区别
这个地方就简单介绍一下 svn 的模式是: 1.写代码. 2.从服务器拉回服务器的当前版本库,并解决服务器版本库与本地代码的冲突. 3.将本地代码提交到服务器. Git分布式版本管理的模式是: 1.写 ...
- Java设计模式学习——设计原则
第一章 设计原则 1.开闭原则 一个软件实体,像类,模块,函数应该对扩展开放,对修改关闭 在设计的时候,要时刻考虑,让这个类尽量的好,写好了就不要去修改.如果有新的需求来,在增加一个类就完事了,原来的 ...
- vue-transition动画
vue-transition动画 官网API: https://cn.vuejs.org/v2/guide/transitions.html demo点击显示与消失 <div id=" ...
- MySql-8.0.12 安装教程随笔
下载地址: https://www.mysql.com/downloads/ 现在最下边的社区版本,也就是免费版本 之后我们会看到有两个选择的下载,一个为zip压缩包格式,一个是Install版本,个 ...
- wepy一些问题和解决方案
wepy一些问题和解决方案 小程序开发和传统的web开发有相识的地方,但是也有不同的地方,要区分. computed属性名和props属性名重复 如果那个组件的渲染值是重名的computed属性,每次 ...
- 虚拟机Linux_Mint中安装vmtools增强工具
一开始用VmwarePro安装Linux系统时,系统的整体界面会缩在屏幕中间的一小块区域内.如图: 看的会非常吃力.为了更好的解决这个问题,就需要安装Vmtools增强工具.安装步骤如下: 1. ...