直接上代码:
/**
* Created by wind on 2018/10/16 14:06
*
* Description:
*
* @flow
*/
import { put, call, fork, take, select} from 'redux-saga/effects';
import * as api from '../../../base/service/http/Api';
import * as actions from '../action/roomList';
import { fetchApi } from '../../../base/utils/SagaHelper';
import * as types from '../types';
import { HUDLoading, Toast } from '../../../base/widgets/index';
import MyToast from "../../../base/widgets/Toast";
const fetchRequestCheckoutApi = fetchApi.bind(null, actions.requestCheckout, api.requestCheckout);
function* watcheRquestCheckout() {
while (true) {
const {payload} = yield take(types.REQUESTCHECKOUT.REQUEST);
HUDLoading.showLoading();
yield fork(fetchRequestCheckoutApi, payload);
const action = yield take([types.REQUESTCHECKOUT.SUCCESS, types.REQUESTCHECKOUT.FAILURE]);
HUDLoading.dismissLoading();
if (action.type === types.REQUESTCHECKOUT.FAILURE) {
MyToast.showToastNoMask(action.payload);
continue;
}
}
}
// 这种写法只支持调用一次,要像上面那样对于success和failure封装在一个里面
// function* watchRquestCheckoutFAILURE() {
// while (true) {
// const {payload} = yield take(types.REQUESTCHECKOUT.FAILURE);
// HUDLoading.dismissLoading();
// Toast.showToastNoMask(payload);
// }
// }
export default [
watcheRquestCheckout
];
可能你看完以后一脸懵逼,说不定几天以后我自己看这篇文章也一脸懵逼。这到底写的啥跟啥,其实啥也不是,就是困扰我三天的一个bug,我一直想不通为什么?这到底为什么?但是在一瞬间,我换了个写法,问题就解决了。在此记录,等下次遇到了,直接换个写法,美滋滋。写代码使我快乐,我最爱写代码。
记录:问题出在redux-saga这里,对于发送一个请求,我采用的是发送一个action,action分为五类,即:
const createActionTypes = actionName => ({
REQUEST: `${actionName}_REQUEST`,
PENDING: `${actionName}_PENDING`,
SUCCESS: `${actionName}_SUCCESS`,
FAILURE: `${actionName}_ERROR`,
RESET: `${actionName}_RESET`,
});
对应的处理方法是:
const creatActionCreators = (actions) => ({
request: (payload) => creatActionCreator(actions.REQUEST, payload),
pending: (payload) => creatActionCreator(actions.PENDING, payload),
success: (payload, meta) => creatActionCreator(actions.SUCCESS, payload, meta),
failure: (payload, meta) => creatActionCreator(actions.FAILURE, payload, meta),
reset: (payload) => creatActionCreator(actions.RESET, payload),
});
一般发送一个请求都会从xxxx_REQUEST往下走,然后分别xxxx_ PENDING,最后走xxxx_ SUCCESS或者xxxx_ FAILURE,但是遇到这个接口只走一次,第二次无论怎么发action,都只走xxxx_REQUEST,然后就没然后了,我检查了所有页面代码,action,reducer,saga,甚至后端的接口我都拿postman调试了,依然没发现问题,后来我就死盯着saga看了,由于这块代码不是我写的,我就猜测100%是这里的问题,果不其然,换了个写法就没问题了。希望对于同样用saga的同学写逻辑处理的时候注意下,这里的坑还是蛮多的。
网友评论