複数のサプレッサー

Question

thisのAPI呼び出しでは、react-reduxとredux-sagaを使用します。私の目標は、別のURLで別のAPI呼び出しを行い、別のページでそれらを使用することです。それを達成する方法？

サガ：

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() 
    ] 
} 

アプリケーション：

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

      </div>); 
    } 
} 
export default connect(state =>({ 
    data:state.data , exception:state.exception 
}))(App); 

私の目標は、私は別のコンポーネントで使用する別の武勇伝を作ることです、そして両者とのない混乱に。それは可能ですか？

Answer 1

もちろん、それはサガの全ポイントです。

典型的なアプリケーションは、特定のアクション/アクション（take効果）を待って、バックグラウンドで複数のサガを待っています。以下は

あなたはredux-saga issue#276からセットアップ複数のサガことができる方法の例です。

./saga.js

function* rootSaga() { 
    yield [ 
     fork(saga1), // saga1 can also yield [ fork(actionOne), fork(actionTwo) ] 
     fork(saga2), 
    ]; 
} 

./main.js

import { createStore, applyMiddleware } from 'redux' 
import createSagaMiddleware from 'redux-saga' 

import rootReducer from './reducers' 
import rootSaga from './sagas' 


const sagaMiddleware = createSagaMiddleware() 
const store = createStore(
    rootReducer, 
    applyMiddleware(sagaMiddleware) 
) 
sagaMiddleware.run(rootSaga) 

Answer 2

Reduxの佐賀を最新のバージョンにall機能を使用しています（0.15 .3）Reduxストアの複数のサガを1つのルートサガに結合する。あなたは佐賀ミドルウェアのルートサガを使用することができますReduxの店で

import { takeEvery, all } from 'redux-saga/effects'; 

... 

function *watchAll() { 
    yield all([ 
    takeEvery("FRIEND_FETCH_REQUESTED", fetchFriends), 
    takeEvery("CREATE_USER_REQUESTED", createUser) 
    ]); 
} 

export default watchAll; 

：Githubの上のあなたのコメントパー

import { createStore, applyMiddleware } from 'redux'; 
import createSagaMiddleware from 'redux-saga'; 

import rootReducer from './reducers'; 
import rootSaga from './sagas'; 

const sagaMiddleware = createSagaMiddleware(); 
const store = createStore(
    rootReducer, 
    applyMiddleware(sagaMiddleware) 
); 

sagaMiddleware.run(rootSaga)