当前位置： 移动技术网 > IT编程>开发语言>JavaScript > rn-fetch-blob+redux 取消请求

rn-fetch-blob+redux 取消请求

2018年09月19日  | 移动技术网IT编程  | 我要评论

中国邮政官网查询,蓝山,蛤蜊疙瘩汤

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

1 let task = rnfetchblob.fetch('get', 'http://example.com/file/1')
2  
3 task.then(() => { ... })
4     // handle request cancelled rejection
5     .catch((err) => {
6         console.log(err)
7     })
8 // cancel the request, the callback function is optional
9 task.cancel((err) => { ... })

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

 1 export const login = (data) => dispatch => {
 2     //ajax 是我们自己封装的方法，但是底层还是rn-fetch-blob，返回的依然是一个promise
 3     let promise = ajax.post({
 4         url:"/user/login",
 5         data:data
 6     });
 7     //这里返回的payload是只有ajax的数据
 8     promise.then(payload=>{
 9         dispatch({type:"login_success",payload});
10     });
11     return promise;
12 };

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

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

当当当当 诞生

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

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

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

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

 

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网