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 ...
随机推荐
- linux 命令——40 wc (转)
Linux系统中的wc(Word Count)命令的功能为统计指定文件中的字节数.字数.行数,并将统计结果显示输出. 1.命令格式: wc [选项]文件... 2.命令功能: 统计指定文件中的字节数. ...
- linux 命令——38 cal (转)
cal命令可以用来显示公历(阳历)日历.公历是现在国际通用的历法,又称格列历,通称阳历.“阳历”又名“太阳历”,系以地球绕行太阳一周为一年,为西方各国所通用,故又名“西历”. 1.命令格式: cal ...
- NYOJ-596-谁是最好的Coder
原题链接 谁是最好的Coder 时间限制:1000 ms | 内存限制:65535 KB 难度:0 描述 计科班有很多Coder,帅帅想知道自己是不是综合实力最强的coder. 帅帅喜欢帅,所以他 ...
- 2018.5.21 . XMLSpy激活的方法
127.0.0.1 altova.com #XMLspy 127.0.0.1 www.altova.com #XMLspy 127.0.0.1 link.altova.com #XMLspy 追加加到 ...
- js 常用工具类
/** * 存储sessionStorage */const setStore = (name, content) => { window.sessionStorage.setItem(name ...
- 漫谈 Clustering (2): k-medoids
上一次我们了解了一个最基本的 clustering 办法 k-means ,这次要说的 k-medoids 算法,其实从名字上就可以看出来,和 k-means 肯定是非常相似的.事实也确实如此,k-m ...
- javascrit中“字符串为什么可以调用成员”
<script> var title = "this is title"; console.log(title.substr(0,5)); //字符串为什么可以调用 ...
- oracle安装报错[INS-30131]执行安装程序验证所需的初始设置失败(无法访问临时位置)解决方法!
最近在电脑上安装oracle12c,安装时,在执行检查环境步骤时候报错: [INS-30131]执行安装程序验证所需的初始设置失败(无法访问临时位置) 最后在网上搜索解决方法,特记录下,以防以后再用到 ...
- 跟我一起从零开始学WCF系列课程
http://www.microsoft.com/china/msdn/events/webcasts/shared/webcast/Series/WCF_Begin.aspx 服务和协定 服务协定使 ...
- C#的接口基础教程之三 定义接口成员
接口可以包含一个和多个成员,这些成员可以是方法.属性.索引指示器和事件,但不能是常量.域.操作符.构造函数或析构函数,而且不能包含任何静态成员.接口定义创建新的定义空间,并且接口定义直 接包含的接口成 ...