Redux Saga 等待進行 api 調用的動作創建者

Question

我有一個動作創建者，正在被這樣觀看：

yield takeLatest('actionCreator', actionFlow);

在文件 X 中。

在動作流內部，有一個 api 調用和另一個調度來將此數據存儲到商店中。

然后，從文件 Y 中，我有一個傳奇，我想調用這個actionCreator 。 所以我去：

yield put({ type: 'actionCreator', etc.. });

但是，在此之后，我確實yield select(selector)其中選擇器選擇此數據並返回 null （就像在 api 調用之前一樣。

有沒有辦法等待“ actionFlow ”結束？

文件 X：

export const aCreator= ({ data, type }) => ({
    type: ACTION_A,
    payload: { data, type },
}); 


function* aFlow() {
   //api call
   //put
}

export default function*() {
    yield takeLatest(ACTION_A, aFlow);
}

文件 Y

import { aCreator } from 'fileX';

function* bFlow(){
    yield put(aCreator({ data }));

    const something = yield select(selector); //this should return the data saved in the reducer by aFlow but return null, as if it didn't wait for aFlow to finish.
}

export default function*() {
    yield takeLatest(ACTION_B, bFlow);
}

Answer 1

put是非阻塞的，所以它不會等到aFlow完成。

function* bFlow() {
   yield put(aCreator({ data }));

   const something = yield select(selector); // this will happen immediately
}

你可以添加一個take前的效果select ，所以它會等到來自呼叫aFlow完成。

function* bFlow() {
   yield put(aCreator({ data }));
   yield take(dispatched action from aFlow after api call);

   const something = yield select(selector); // will wait until aFlow finishes
}

分派的動作實際上可以是任何東西：

function* aFlow() {
   //api call
   //put
   yield put('api_finished');
}

function* bFlow() {
   yield put(aCreator({ data }));
   yield take('api_finished');

   const something = yield select(selector); // will wait until aFlow finishes
}