web-dev-qa-db-fra.com

Sélecteurs Redux Saga, comment accéder à l'état depuis une saga?

Des questions similaires ont déjà été posées, mais les réponses ne m'ont pas aidé.

Que sont les sélecteurs dans redux?

Comment obtenir quelque chose de l'état/magasin dans une fonction redux-saga?

Je pense que j'ai une configuration différente car je n'arrive pas à accéder à l'état depuis ma saga.

J'ai essayé de faire:

const getList = store => store;
const getList = state=> state;

ces deux retournent undefined.

Mon magasin ressemble à ça ...

export default function createStoreWithMiddleware() {
    const sagaMiddleware = createSagaMiddleware();
    const loggerMiddleware = createLogger();
    const middleware = [sagaMiddleware, loggerMiddleware];
    const persistedState = localStorage.getItem('reduxState') ? JSON.parse(localStorage.getItem('reduxState')) : {};

    const store = createStore(reducer, persistedState, compose(
        applyMiddleware(...middleware)
    ));

    store.subscribe(() => {
        localStorage.setItem('reduxState', JSON.stringify(store.getState()));
    });

    sagaMiddleware.run(rootSaga);

    return store;
}

Et je veux accéder à ma liste dans cette saga:

function* selectTender(action) {
    try {
        const response = yield Api.getTenderById(action.payload);
        yield put({type: 'SELECT_TENDER_SUCCEEDED', currentTender: response});
        const list = yield select(getList);
        yield put({type: 'FETCH_CHAPTERS', chaptersList: list, tenderId: response.id});
    } catch (err) {
        yield put({type: 'SELECT_TENDER_FAILED', message: err.message});
    }
}

export function* watchSelectTender(){
    yield takeEvery('SELECT_TENDER', selectTender);
}

Mais comme je l'ai dit, state et store ne sont pas définis.

Alors, comment puis-je accéder à ma boutique (ou à mon état) dans la saga?

reactjsreact-reduxredux-saga
15
Winter

Vous devrez utiliser des sélecteurs pour cela. Je vais donner un exemple simple. Créez un fichier selectors.js et ajoutez les champs que vous souhaitez sélectionner dans votre boutique, comme indiqué ci-dessous.

export const username = (state) => state.user.name;

Ensuite, dans votre saga, importez les sélecteurs en tant que,

import * as selectors from './selectors';

et lorsque vous avez besoin de username dans votre saga, vous pouvez simplement le faire,

import {select} from 'redux-saga/effects';
...
...
function *sampleSaga(params) {
   const username = yield select(selectors.username);
}

la constante username dans sampleSaga contiendra désormais la valeur du nom d'utilisateur de state.

39
Vishal Sharma