首页 > 解决方案 > 流之间的挂钩逻辑:Rxjs Firebase Firestore

问题描述

 this.store
      .collection(collectioName)
      .onSnapshot((data) => {
        
      });

我们可以使用 onSnapshot() 方法收听文档。每次内容更改时,另一个调用会更新文档快照。

我正在寻找我们可以在数据即将更改/发出和流接收到的数据之间使用的钩子/ rxjs 运算符。

这将有助于

  1. 当我们获得新数据时显示加载微调器或
  2. 当我们收到新的更新时禁用表格或表格

就像是

 this.store
      .collection(collectioName)
      .onSnapshot()
.pipe(
  aboutToInitiate(() => { // start spinner },
  dataReceived(() => { // stop spinner, stream received }

).subscribe(() => {
// Or we can stop spinner here, but where exactly we hook the logic to start spinner 
    

);

注意:创建/更新(手动触发)时,我们可以启动微调器并在成功时停止。但是当流返回由服务器或实时更新触发的更新时,当我们当时订阅时,我们需要显示我们即将接收一些数据和更新/接收的数据的微调器或指示器。

所以简而言之,订阅之间有一个钩子,当即将接收数据时自动启动微调器,当数据接收时自动停止。

我们可以使用 tap 操作符,但它会在收到数据后触发,而不是在启动更新过程时触发。

标签: firebasegoogle-cloud-firestorerxjs

解决方案


onSnapshot()实时监听数据变化。这意味着您只能在初始化时使用微调器。之后的每一次更改都会立即发生,您的设备会从后端接收它或从您的设备更改。您可以在初始化之前启动 SpinneronSnapshot()

//START Spinner

 const unsub= this.store
      .collection(collectioName)
      .onSnapshot((data) => {
        //STOP Spinner
      });


//Stop listener
unsub()

使用 ,unsub您可以停止收听实时更改。

您应该考虑的一件事是您是否启用了offline功能。在这种情况下,您可以同时监听这两种变化:写入设备缓存的数据和写入后端的数据。您可以通过启用元数据更改为您的听众来做到这一点,如下所示:

db.collection("cities").doc("SF")
    .onSnapshot({
        // Listen for document metadata changes
        includeMetadataChanges: true
    }, (doc) => {
        // ...
    });

然后,您可以检测数据是否仅写入设备或服务器:

db.collection("cities").doc("SF")
    .onSnapshot((doc) => {
        var source = doc.metadata.hasPendingWrites ? "Local" : "Server";
        console.log(source, " data: ", doc.data());
    });

你可以在这里找到更多关于它的信息。

metada可以确定何时将数据写入本地(然后启动微调器)以及何时将其写入服务器(停止微调器)


推荐阅读