Redux传奇 - 工作者传奇未被召唤反应原生

时间:2018-03-25 05:53:50

标签: reactjs react-native redux redux-saga

我正在尝试在简单的应用上处理与redux saga的异步操作。它调用api从本地代理服务器获取一些推文。

通过查看日志,我可以看出观察者的传奇正在运行,行动正在被调度,减速器正在被解雇但是工作者的传奇没有被调用......

这是我的代码 - https://github.com/TechyTimo/react-native-tweets

store.js

import { Platform } from 'react-native';
import RootReducer from './reducers';

import { applyMiddleware, createStore, compose } from 'redux';
import createSagaMiddleware from 'redux-saga';
import rootSaga from './sagas';
import logger from 'redux-logger';

import devTools from 'remote-redux-devtools';

const sagaMiddleware = createSagaMiddleware();

const Store = createStore(
    RootReducer,
    compose(
        applyMiddleware(sagaMiddleware, logger),
        devTools({
            name: Platform.OS,
            hostname: 'localhost',
            port: 5678,
            suppressConnectErrors: false,
        }),
    )
);

sagaMiddleware.run(rootSaga);

export default Store;

actions.js

import { log } from './utilities.js';

export const SEARCH_FOR_TWEETS_REQUESTED = 'SEARCH_FOR_TWEETS_REQUESTED';

export function searchForTweetsRequested(searchText) {
  log('dispatch request') // getting logged
  return {
    type: SEARCH_FOR_TWEETS_REQUESTED,
    searchText
  }
}

sagas.js

import { call, put, fork, takeEvery, takeLatest } from 'redux-saga/effects'
import api from './api'
import { log } from './utilities'

import { 
  SEARCH_FOR_TWEETS_REQUESTED, 
  searchForTweetsSuccess,
  searchForTweetsError, 
} from './actions';

// Worker sagas
function* fetchTweets(action) {
  log('worker saga '+ action.type) // not getting logged
  try {
    const activeSearch = yield select(state => state.searches.activeSearch)
    log('emptying activeSearch: ' + activeSearch)
    yield put(setActiveSearch(''));

    log('api call... ' + action.searchText)
    const tweets = yield call(api.search, action.searchText);

    yield put(searchForTweetsSuccess(action.searchText, tweets));
  } catch (error) {
    yield put(searchForTweetsError(action.searchText, error.message));
  }
}

/*
  Watcher sagas
*/
export function* watchSearchTweets() {
  log('watchSearchTweets') // getting logged
  yield* takeEvery(SEARCH_FOR_TWEETS_REQUESTED, fetchTweets); // Allow concurrent workers
}

// Root saga that will be run, we just fork the watcher sagas
export default function* rootSaga() {
  yield fork(watchSearchTweets);
}

1 个答案:

答案 0 :(得分:3)

原来我正在抓取" takeEvery"来自" redux-saga / effects"而不是来自" redux-saga"。其他固定也包含在下面:

sagas.js

import { takeEvery } from 'redux-saga';
import { call, put, fork, select } from 'redux-saga/effects'
import api from './api'
import { log } from './utilities'

import { 
  SEARCH_FOR_TWEETS_REQUESTED, 
  searchForTweetsSuccess,
  searchForTweetsError, 
  setActiveSearch
} from './actions';

// Workers sagas
function* fetchTweets(action) {
  log('worker saga '+ action.type)
  try {
    const activeSearch = yield select(state => state.searches.activeSearch)
    log('emptying activeSearch: ' + activeSearch)
    yield put(setActiveSearch(''));

    log('api call... ' + action.searchText)
    const tweets = yield call(api.search, action.searchText);

    yield put(searchForTweetsSuccess(action.searchText, tweets));
  } catch (error) {
    yield put(searchForTweetsError(action.searchText, error.message));
  }
}

/*
  Watcher sagas
*/
export function* watchSearchTweets() {
  log('watchSearchTweets')
  yield* takeEvery(SEARCH_FOR_TWEETS_REQUESTED, fetchTweets); // Allow concurrent workers
}

// Root saga that will be run, we just fork the watcher sagas
export default function* rootSaga() {
  yield fork(watchSearchTweets);
}