rn-fetch-blob+redux 取消请求

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

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多是这样的npm

 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这样干其实很恶心,都要作这样的两个操做,效率没提升,反而多了不少的冗余代码redux

想了想,干脆本身写个中间件来处理这个吧 promise

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

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

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调用方法,因此你们放心的用吧url

固然你们也能够根据须要本身写redux middleware,很简单的spa

相关文章
相关标签/搜索