firebase - 如何将 Flutter TextField 与 Firestore 字段同步？

Question

我在 Firestore 中有 task 文档，它有 todo 字段，在 Flutter UI 中有 TextField。

请指教如何使 textfield 与 todo 字段同步，即

1. 任何时候，textfield 中的文本都会随着用户的输入而改变，用刚输入的值更新 todo 字段。
2. 每当 todo 字段更新(在 Firestore 控制台中手动或由其他用户更新)时，使用最新值更新 textfield。

谢谢!

Answer 1

首先，为 TextField 提供一个 TextEditingController(完整示例请查看 this)。

对于问题的第一部分，您需要为 TextEditingController 提供一个listener。此 listener 应触发如下函数:

  Future<void> _updateTaskValue(String text) {
    Firestore().runTransaction((Transaction transaction) {
      Firestore.instance.document([PATH OF YOUR DOCUMENT]).updateData({"todo": text});
    });
  }

假设 text 是 Controller 的 text 值。请注意，runTransaction 用于避免数据并发。

对于问题的第二部分，您将必须听文档。为此，在 initState 中声明一个 StreamSubscription :

subscription = Firestore.instance.document("").snapshots().listen(
    (DocumentSnapshot snapshot) => this._onDatabaseUpdate(snapshot));

每次内容更新时(无论是当前用户更新 TextField、其他用户更新还是从后台手动更新)，此订阅都会触发一个函数。

下面调用的函数只是用新内容更新 Controller 的 text 属性:

void _onDatabaseUpdate(DocumentSnapshot snapshot) {
  setState(() {
    _controller.text = snapshot.data["todo"];
  });
}

有关完整示例，请参阅 this gist .