redux-saga 中的 takeSequential？

Question

我有一个基本的传奇，如下所示：

const mySaga = function* () {
    yield takeEvery("SOME_ACTION_REQUEST", function* (action) {

        const result = yield call(makeApiCall, action.payload); 
        yield put({
            type: "SOME_ACTION_SUCCESS", 
            payload: result
        }); 

    });  
}

现在我遇到的问题是，如果我"SOME_ACTION_REQUEST"同时调度两个，那么我会遇到 redux 调用堆栈如下所示的情况：

SOME_ACTION_REQUEST
SOME_ACTION_REQUEST
SOME_ACTION_SUCCESS
SOME_ACTION_SUCCESS

这搞乱了我的减速器中的逻辑。

我想要的是运行每个请求，但要等待前一个请求完成后再开始。

IE。所以它看起来像：

SOME_ACTION_REQUEST
SOME_ACTION_SUCCESS
SOME_ACTION_REQUEST
SOME_ACTION_SUCCESS

我将如何实现这一目标？

Answer 1

actionChannel可以使用该效果来实现此目的。

请参阅：https://redux-saga.js.org/docs/api/#actionchannelpattern-buffer

const mySaga = function* () {
    const channel = yield actionChannel("SOME_ACTION_REQUEST"); 
    while (true) {
        const action = yield take(channel); 
        const result = yield call(makeApiCall, action.payload); 
        yield put({
            type: "SOME_ACTION_SUCCESS", 
            payload: result
        }); 
    }
}

解释：

我的理解是，actionChannel效果只是将所有与该模式匹配的传入请求路由到队列中。

效果take会让它们消失。

将所有内容放入一个while(true)循环中意味着操作将一次弹出一个，并且它们需要等待解决所有其余的事情（API 调用），然后才能调用下一个操作。

关于此模式需要注意的一件事是，在 redux-dev-tools 中，redux 堆栈仍然如下所示：

SOME_ACTION_REQUEST
SOME_ACTION_REQUEST
SOME_ACTION_SUCCESS
SOME_ACTION_SUCCESS

因为请求会立即添加到通道中并保持非活动状态，直到它们被弹出。