Question

我目前正在使用Firestore和Mobx开发Flutter应用程序。我使用mobx来使UI保持最新状态，并对firestore进行api调用（因此数据流为firestore-> mobx store-> UI）。我想设置侦听器以侦听Firestore集合中的实时更改。理想情况下，我想在mobx中设置此侦听器，但是我不确定这将如何工作-mobx商店是监听Firestore更改的正确位置吗？我担心的一件事是，在mobx存储中没有可以分离侦听器的dispose方法。我想知道这是否是一种可接受的方式来更新我的商店中的变量（从而间接更新UI），或者是否需要切换到BLoC /流模型。任何对此问题的一般建议（即监听实时Firestore更新并将更改传播到UI的最佳方法）都将受到欢迎！

Answer 1

我没有使用颤振，但我想应该没什么不同。

这是我如何监听应用程序中用户个人资料更改的示例。

class UserModel {
  @observable id = ''

  updateDetails (userUpdate) {
    // update observable properties
  }

  destroy () {
    // Call destroy to remove listener
    if (this.stopWatch) {
      this.stopWatch()
    }
  }

  init () {
    // firestore onSnapshot returns a disposer, keep it on the instance
    this.stopWatch = fdb.collection('users').doc(this.id).onSnapshot((doc) => {
      if (doc.exists) {
        this.updateMyDetails(doc.data())
      }
    })
  }

  constructor ({id}) {
    // ...
    this.id = id
  }
}

const user = new UserModel({id: 'firestoreId')})
user.init()

// then any observer, like your UI, is listening to changes of the userModel data

//...

user.destroy() // for example when the user signs out.

请注意，如果您想将这些关注点分开，而不是使用此init函数，则可以听取模型外部的更改。

如果您想知道为什么我检查if (doc.exists)，那是因为如果文档不存在，Firestore不会向您发送任何错误。（如http 404）。您需要自己处理。

在Mobx存储中创建Firestore侦听器（颤振）

1 个答案: