redux-saga tatsächlich verbrauchen Daten

Question

Ich habe viele Tutorials in Bezug auf 'Redux-Saga' gelesen und zu verstehen, wie meine Reducers und Sagas strukturieren, um direkt auszuführen. Das Problem, das ich habe, ist, dass ich nicht weiß, um die angeforderten Daten auf eine Weise zu holen, die etwas zurückgibt, das ich verwenden kann. Was nutzen die meisten Leute, um die angeforderten Daten tatsächlich abzurufen?

Hier ist meine Anfrage 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 }; 
    } 
} 

..Die "yield Anruf (holen ..." gibt einen ReadableStream in Chrome und wenn ich 'isomorph-Fetch' verwenden, wie ich mit redux-Thunk tat es gibt ein Versprechen zurück Ich kann ein Versprechen in einer Generatorfunktion nicht von dem, was ich sehe, verwenden

Ich bin mir sicher, dass dies wahrscheinlich eine einfache Codezeile ist, um das Ergebnis zu konsumieren, aber ich kann nicht scheinen Jede Hilfe wird geschätzt!

Answer 1

So die Antwort, die alle (oder die meisten) der Beispiele auf dem i Nternet Glanz ist, dass ich das Versprechen in einer Wrapper-Funktion lösen muss und dann kann ich den Generator wie erwartet verwenden. Nach dem Beispiel hier:

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

ich teilten meine Anfrage Generator in zwei getrennte Verfahren und vollständig das Versprechen in der Helferfunktion behoben. Das Endergebnis ist, wie folgt:

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 }; 
    } 
} 

Das nach wie vor erlaubt es mir, ‚isomorph-Fetch‘ zu verwenden, wie zuvor, aber immer noch in eine Saga zu machen.