对流 redux observable 的重复操作

Question

我在订阅套接字 io 事件时触发了重复的操作。

const onStartGameActionEpic = (action$, state$) => action$.pipe( ofType(ON_START_GAME), mergeMap(() => fromEvent(socket, 'newGameCreated').pipe( map(response => onStartGameFulfilled(response)), ), ), );

Answer 1

每次 ON_START_GAME 发生时，您都在创建一个新的侦听器，但您永远不会杀死旧的侦听器。这就是问题的根源。

修复 1

将 mergeMap 更改为 switchMap。

修复 2

您可能希望同时进行多个游戏。如果是这样，请为您的 ON_START_GAME 操作分配一个 namespace 道具。当游戏结束动作触发时，杀死那个特定的可观察者。

const onStartGameActionEpic = (action$, state$) =>
    action$.pipe(
        ofType(ON_START_GAME),
        mergeMap(onStartGameAction =>
            fromEvent(socket, 'newGameCreated').pipe(
                takeUntil(action$.pipe(
                    ofType(ON_END_GAME),
                    filter(onEndGameAction => (
                        endGameAction.namespace === startGameAction.namespace
                    )),
                )),
                map(response => onStartGameFulfilled(response)),
            ),
        ),
    );

对流 redux observable 的重复操作

duplicate action on stream redux observable

socket.io

redux-observable

修复 1

修复 2