使用NGRX效果的乐观更新策略

Question

我们正在在公司工作的项目中集成NGRX库，并希望在前端执行乐观的更新，而是等待服务器响应以执行某些操作。我们尝试使用的是使用startWith运算符，但它抛出了Action properly，然后，由于releaseService.deleteRelease方法不返回操作，它会引发invalid action: null错误。

我们试图将{dispatch: false}配置添加到@Effect，但是第一个动作没有投入...

我们也有关于使用tap Oeprator并直接向商店派遣一些动作，但我们认为它是一种反模式。

那么，是否可以在不创建splitter中间动作的情况下实现此目标？谢谢。

@Effect()
deleteRelease$ = this.actions$.pipe(
    ofType(ReleaseCardActions.ReleaseCardActionTypes.DeleteRelease),
    exhaustMap((action: ReleaseCardActions.DeleteRelease) => {
        return this.releaseService.deleteRelease(action.id).pipe(
            startWith(new DeleteReleaseSuccess(action.id)),
            catchError(() => of(new ReleasesApiActions.DeleteReleaseFailure()))
        );
    }),
);

Answer 1

也许我不明白这个问题，但是为什么不直接在还原器中对 deleterelease 操作进行乐观更新独立采取同一动作。然后，您可以从Expet的响应中执行"真实"更新。

@Effect()
deleteRelease$ = this.actions$.pipe(
    ofType(ReleaseCardActions.ReleaseCardActionTypes.DeleteRelease),
    exhaustMap((action: ReleaseCardActions.DeleteRelease) => {
        return this.releaseService.deleteRelease(action.id).pipe(
            map(new DeleteReleaseSuccess(action.id)),
            catchError(() => of(new ReleasesApiActions.DeleteReleaseFailure()))
        );
    }),
);