处理多个 NgRx 组件存储更新

Question

如果我有许多 Observables 同时触发更新并且所有更新都会对存储中的同一属性产生影响，如何正确处理 NgRx 组件存储的更新？

使用官方文档中的示例来存储电影：我有许多 Observables，它们可能会导致有关显示哪些电影的更改。想像一下我的组件中有以下几个代码片段：

someMovie.pipe(takeUntil(this.onDestroy$)).subscribe(({movie: IMovie, shouldBeDisplayed: boolean}) => {
  this.updateMovieVisibility(movie, shouldBeDisplayed);
});

而组件库的功能实现是这样的：

public updateMovieVisibility(movie: IMovie, shouldBeDisplayed: boolean) {
  this.patchState((state) => {
    let newMoviesToDisplay = [...state.displayedMovies];

    if (shouldBeDisplayed) {
      newMoviesToDisplay.push(movie);
    } else {
      newMoviesToDisplay = newMoviesToDisplay.filter((item) => item.id !== movie.id);
    }

    return {
      displayedMovies: newMoviesToDisplay,
    };
  });
}

现在我面临一个问题，应该显示几部新电影。他们的 Observables“同时”发出。根据我的调试输出，以下内容按时间顺序发生。

1. [开头只显示电影X]
2. 电影 Y 的 Observable 发出。调试输出显示

   state.displayedMovies

   在开头包含电影 X，并且

   newMoviesToDisplay

   在 return 语句之前包含两个电影

   [X, Y]

   。
3. 电影 Z 的 Observable 发出。调试输出显示

   state.displayedMovies

   仅包含电影 X。状态更新尚未处理，因此缺少电影 Y 也应显示的信息。因此，patchState 更新仅返回

   [X, Z]

   ，而不是

   [X, Y, Z]

   。
4. 其他调试代码显示已发出对存储的更改。我的选择器首先发出

   [X, Y]

   ，然后发出

   [X, Z]

   。

遇到这种情况我该如何正确处理？我的第二次状态更新尚未看到第一次更新所做的更改。是否有某种机制允许我在调用下一个

patchState()

之前等待所有挂起的状态更新？

Answer 1

如何将 updateMovieVisibility 设为

effect

- 效果对可观察量起作用 - 这些应该有“某种”顺序 - 至少不应发生并发更改。 然后效果应该调用更新程序（或直接改变状态）。