web-dev-qa-db-ja.com

redux sagaセレクター、sagaから状態にアクセスするにはどうすればよいですか?

同様の質問が以前に尋ねられましたが、答えは私にとって何の助けにもなりませんでした。

reduxのセレクターとは?

redux-saga関数内の状態/ストアから何かを取得する方法?

サガから状態にアクセスできないように見えるので、私は別のセットアップを持っていると思います。

私はやってみました:

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

これらは両方ともundefinedを返します。

私の店はこんな感じ...

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;
}

そして、私はこのサガの私のリストにアクセスしたい:

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);
}

しかし、私が言ったように、statestoreはどちらも未定義です。

それでは、どのようにしてサガのストア(または州)にアクセスしますか?

15
Winter

そのためにはセレクターを使用する必要があります。簡単な例を挙げます。ファイルを作成するselectors.jsそして、以下に示すように、ストアから選択するフィールドを追加します。

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

次に、あなたのサガで、セレクターをインポートします、

import * as selectors from './selectors';

そして、あなたがサガでusernameを必要とするとき、あなたは単にすることができます、

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

usernameの定数sampleSagaは、状態からのユーザー名の値を保持するようになりました。

39
Vishal Sharma