多个redux-sagas

13 浏览
0 Comments

多个redux-sagas

我在这个示例中使用了react-redux和redux-saga来进行API调用。我的目标是使用不同的URL进行其他API调用,并在不同的页面中使用它们。如何实现这一目标?

Sagas:

import { take, put, call } from 'redux-saga/effects';
import { takeEvery, delay, takeLatest } from 'redux-saga';
function fetchData() {
    return fetch("https://api.github.com/repos/vmg/redcarpet/issues?state=closed")
        .then(res => res.json())
        .then(data => ({ data }))
        .catch(ex => {
            console.log('parsing failed', ex);
            return ({ ex });
        });
}
function* yourSaga(action) {
    const { data, ex } = yield call(fetchData);
    if (data)
        yield put({ type: 'REQUEST_DONE', data });
    else
        yield put({ type: 'REQUEST_FAILED', ex });
}
export default function* watchAsync() {
    yield* takeLatest('BLAH', yourSaga);
}
export default function* rootSaga() {
    yield [
        watchAsync()
    ]
}

App:

import React, { Component } from 'react';
import { connect } from 'react-redux';
class App extends Component {
    componentWillMount() {
        this.props.dispatch({ type: 'BLAH' });
    }
    
    render() {
        return (
            
{this.props.exception && exception: {this.props.exception}} Data: {this.props.data.map(e => e.url)}
); } } export default connect(state => ({ data: state.data, exception: state.exception }))(App);

我的目标是创建另一个saga,我将在另一个组件中使用它,并且两者不会互相干扰。这可能吗?

0