关于课程里对异步action封装的问题?
来源:9-6 组件开发:其他组件

Jeffacode
2019-02-18
看到第十章代码了,发现middleware/api.js还是只对GET做了一个封装而已,简单来说,就是由原先发一个异步action,变成发一个同步action,然后在到达reducer前被拆成了3个actions,在异步的不同阶段有选择地dispatch。问题是,还有POST、PATCH和DELETE请求呢?我估摸着应该还要做类似的封装,好像也很啰嗦。。。不过这还不是问题所在,真正的问题是:在发了一个action后,假设请求成功了,我还想拿请求回来的数据里的某个字段再发一个action怎么办?换句话说,这种封装方法把整个异步流都放进了middleware里,我们接触不到了!但明明异步流应该是留给我们来掌控的啊?
写回答
1回答
-
你好,课程中的api 中间件只是封装了常用的异步流程,而且中间件只是简化了调用代码和预处理了返回的数据的结构,返回数据你依然是可以获取到的,并不是接触不到的。
例如,home.js加载特惠商品的action creator,如果想根据返回的数据继续发送其他action,可以参考如下:
loadDiscounts: () => { return (dispatch, getState) => { const {ids} = getState().home.discounts if(ids.length > 0) { return null; } const endpoint = url.getProductList( params.PATH_DISCOUNTS, 0, params.PAGE_SIZE_DISCOUNTS ); return dispatch(fetchDiscounts(endpoint)).then(data => { // 发送新的action, data.response中包含api调用返回的数据 return dispatch(anotherAction(data.response)) }); }; }
如果有特殊场景,api中间件无法满足需求,可以直接redux-thunk发送异步流,跳过api中间件的处理,只要action中没有FETCH_DATA属性,就不会被api中间件处理。
112019-02-18
相似问题