redux-saga가 실제로 데이터를 사용하고 있습니다.

Question

'redux-saga'에 관한 튜토리얼을 많이 읽었으며 직접적으로 실행할 수있는 레 듀서와 사가를 구성하는 방법을 알고 있습니다. 내가 가지고있는 문제는 내가 사용할 수있는 것을 반환하는 방식으로 요청 된 데이터를 실제로 가져 오는 것을 알지 못한다는 것입니다. 대부분의 사람들이 요청한 데이터를 실제로 가져 오기 위해 무엇을 사용합니까? "... 수율 호출 (가져 오기"

import { call } from 'redux-saga/effects'; 

export function* request(url, method, body) { 
    try { 
     const result = yield call(fetch, url, { method: method, body: body }); 
     return {err: null, res: result }; 
    } catch(error) { 
     return {err: error, res: null }; 
    } 
} 

용맹 한 크롬에 ReadableStream를 반환하고 내가 사용하는 경우 내가 REDUX-썽크 함께했던 것처럼 '- 동형 가져 오기': 여기

내 요청 사가입니다 그것은 약속을 반환합니다. 내가 볼 수있는 것에서 발전기 기능에 대한 약속을 사용할 수 없습니다. 결과를 소비하는 코드는 아마도 단순한 코드 라인이지만 확신 할 수 없습니다. 그것을 찾으십시오. 어떤 도움을 주시면 감사하겠습니다.

Answer 1

그래서 나는 모든 (또는 대부분의) nternet gloss over는 래퍼 함수에서 약속을 해결해야하며 예상대로 생성기를 사용할 수 있습니다. 여기에 예를 들어 다음과 같습니다

Building an image gallery using react, redux and redux-saga

나는 두 개의 별도의 방법으로 내 요청 생성기를 분할 완전히 도우미 함수 내에서 약속을 결심했다. 이것은 여전히 ​​날 이전처럼 '동형 ​​페치'를 사용하지만 여전히 사가로를 만들 수 있습니다

import { call } from 'redux-saga/effects'; 
import fetch from 'isomorphic-fetch'; 

const actualRequest = (method, url, body) => { 
    return fetch(url, { method: method, body: body }) 
     .then(response => response.json() 
     .then(json => json)); 
} 

export function* request(method, url, body) { 
    try { 
     const result = yield call(actualRequest, method, url, body); 
     return {err: null, res: result }; 
    } catch(error) { 
     return {err: error, res: null }; 
    } 
} 

다음과 같이 최종 결과입니다.