77

I have a store with a list of items. When my app first loads, I need to deserialize the items, as in create some in-memory objects based on the items. The items are stored in my redux store and handled by an itemsReducer.

I'm trying to use redux-saga to handle the deserialization, as a side effect. On first page load, I dispatch an action:

dispatch( deserializeItems() );

My saga is set up simply:

function* deserialize( action ) {
    // How to getState here??
    yield put({ type: 'DESERISLIZE_COMPLETE' });
}

function* mySaga() {
    yield* takeEvery( 'DESERIALIZE', deserialize );
}

In my deserialize saga, where I want to handle the side effect of creating in-memory versions of my items, I need to read the existing data from the store. I'm not sure how to do that here, or if that's a pattern I should even be attempting with redux-saga.

B--rian
  • 4,650
  • 8
  • 25
  • 63
Andy Ray
  • 26,451
  • 11
  • 86
  • 123

2 Answers2

218

you can use select effect

import {select, ...} from 'redux-saga/effects'

function* deserialize( action ) {
    const state = yield select();
    ....
    yield put({ type: 'DESERIALIZE_COMPLETE' });
}

also you can use it with selectors

const getItems = state => state.items;

function* deserialize( action ) {
    const items = yield select(getItems);
    ....
    yield put({ type: 'DESERIALIZE_COMPLETE' });
}
Goodbye StackExchange
  • 21,680
  • 7
  • 47
  • 83
Kokovin Vladislav
  • 9,175
  • 5
  • 32
  • 33
-6

Select effect does not help us if we in a callback functions, when code flow is not handled by Saga. In this case just pass dispatch and getState to root saga:

store.runSaga(rootSaga, store.dispatch, store.getState)

And the pass parameters to child sagas

export default function* root(dispatch, getState) { yield all([ fork(loginFlow, dispatch, getState), ]) }

And then in watch methods

export default function* watchSomething(dispatch, getState) ...

Alex Shwarc
  • 688
  • 8
  • 20
  • This seems more like an anti-pattern. Redux saga is middleware already and shouldn't need something this kludgy. What is a callback function not handled by a saga? How does passing something INTO the saga help something that is not handled by the saga? – Yehuda Makarov Dec 27 '19 at 03:23
  • I do not agree. `yield select()` is only applicable at saga context. Only. Saga can involve some functions, other libraries with user interactions via callbacks. By that time when callback fired - saga may not present at all. This is a way how to use Store, when Saga is out. (for example frontend microservices, web-component approach with multiple stores, saga, react and so on) – Alex Shwarc Dec 27 '19 at 19:20