在组件之间共享 Auth Observable 值而无需多次执行

Question

我有一个 AuthService 从 Firebase 获取 Observable<auth> 数据并将其放入 public 变量 auth$.

在我的应用中的某个地方，我需要多个组件来访问此 auth$ 值以检查其内容。

我目前只是在做 this.authService.auth$.subscribe(auth => this.auth = auth) 组件。

是否意味着我多次执行fetch data from Firebase？
如果是，我是否应该将 auth$ 定义为 Subject/BehaviorSubject，订阅服务并使用 .next 推送数据？

Answer 1

默认情况下，可观察对象未启用多播。这意味着多个订阅将生成自己的流。由于您不想为每个订阅重新获取身份验证凭据，因此您需要使原始流与多播兼容。这是使用 share() 运算符完成的，它将在第一次订阅时使流成为热点，并在内部存储所有后续订阅的引用计数。

由于晚会的订阅不会在流变热时自动获取之前发出的值，我们需要构建功能来重播发出的值。

这两个要求结合在 shareReplay() 运算符中，使您可以多播最新的 n 值。

因此您的代码将如下所示：

const authStream = this.authService.auth$.shareReplay(1);

// component 1
const myAuthDisposable = authStream.subscribe(auth => this.auth = auth)

// component 2
const myAuthDisposable = authStream.subscribe(auth => this.auth = auth)

在组件之间共享 Auth Observable 值而无需多次执行

Sharing Auth Observable value between components without executing it multiple times

subject

reactive-programming

observable

rxjs

angular