redux-saga实际上消耗数据

时间:2016-10-15 19:50:41

标签: javascript react-redux redux-saga

我已经阅读了很多关于'redux-saga'的教程,并了解如何构建我的reducer和sagas直接执行。我遇到的问题是我不知道以一种返回我可以使用的方式实际获取所请求的数据。大多数人用什么来实际获取所请求的数据?

这是我的请求传奇:

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

..“yield call(fetch ...”在Chrome中返回一个ReadableStream,如果我使用'isomorphic-fetch'就像我使用redux-thunk一样,它返回一个promise。我不能在一个promise中使用promise从我能看到的发电机功能。

我确信这可能是一个简单的代码行来消耗结果,但我似乎无法找到它。任何帮助表示赞赏!

1 个答案:

答案 0 :(得分:1)

因此,互联网上所有(或大部分)示例的答案都是我需要在包装函数中解析承诺然后我可以按预期使用生成器的答案。按照这里的例子:

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

我将请求生成器拆分为两个单独的方法,并完全解决了辅助函数中的promise。最终结果如下:

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

这仍然允许我使用'同构提取'和以前一样,但仍然会成为一个传奇。