redux thunk에서 api call wrapper를 redux saga로 마이그레이션하는 방법

Question

최근에 redux-saga를 사용하기 시작했으며 정말 좋아합니다.

약속 (내 API 호출)을 취하고 프리 로더를 표시하고 오류를 처리하는 API 호출에 다음과 같은 래퍼가 있습니다.

export const callApi = (promise: Promise<any>, errorMsg: string = 'Api error') => (dispatch: Dispatch) => { 
    dispatch(setLoading(true)); 
    return promise.then(
    (response) => { 
     dispatch(setLoading(false)); 
     return response.body; 
    }, 
    (error) => { 
     dispatch(setLoading(false)); 
     dispatch(apiError(errorMsg, error)); 
     return error; 
    }); 
}; 

나는 이러한 방식으로 redux saga에서 어떻게 동작합니까? 나는 이와 같은 일을하는 어떤 예도 찾을 수 없었다.

---

은 지금까지 나는

const camelizeKeysPromise = (obj) => Promise.resolve(camelizeKeys(obj)); 


export function* sagaCallApi(promise: Promise<any>, errorMsg: string = 'Api error') { 
    yield put(setLoading(true)); 
    try { 
     const response = yield call(promise); 
     try { 
     const result = yield call(camelizeKeysPromise(response.body)); 
     return result; 
     } catch (e) { 
     return response.body; 
     } 
    } catch (exception) { 
     yield put(setLoading(false)); 
     yield put(apiError(errorMsg, error)); 
    }; 
} 

Answer 1

원하는 응답을 반환하지 않습니다 약속하는 call 항복을 마련했습니다. redux-saga에서 eventChannel을 사용하여 성공하면 응답을 내보내는 채널을 만들거나 실패한 경우 오류 개체를 생성 한 다음 사가의 채널을 구독 할 수 있습니다.

const promiseEmitter = promise => { 
    return eventChannel(emit => { 
    promise.then(
     response => emit({response}), 
     error => emit({error}) 
    ); 
    }); 
}; 

이와 약속에 전화를 교체하여 새로운 무용담을 수정

const channel = yield call(promiseEmitter, promise); 
const {response, error} = yield take(channel); 
if(response){ 
    // handle success 
    return response; 
}else if(error){ 
    // handle failure 
    yield put(setLoading(false)); 
    yield put(apiError(errorMsg, error)); 
} 

내가 편집기없이이 쓴 내 코드에 구문 오류가있을 수 있음을 알고 있어야합니다,하지만 당신은 할 수 일반적인 접근법을 얻으십시오.