如何在 flutter 不刷新的情況下從 firebase 檢索數據

Question

我在 Firebase 實時數據庫中有 Boolean 值我想要在 flutter 中沒有屏幕刷新的更新值。我希望它在 flutter 上更新流線型

Answer 1

處理您的問題的一種簡單方法是使用“cloud_firestore”package。我將在下面制作 ua 示例代碼。

注意：在使用 Firestore 之前，您必須首先確保已初始化 FlutterFire：點擊此鏈接： https://firebase.flutter.dev/docs/overview/#initializing-flutterfire

import 'package:flutter/material.dart';


class TestWidget extends StatefulWidget {
  const TestWidget({Key? key}) : super(key: key);

  @override
  _TestWidgetState createState() => _TestWidgetState();
}

class _TestWidgetState extends State<TestWidget> {
  final Stream<QuerySnapshot> _usersStream =
      Firebas`eFirestore.instance.collection('your collection name in database here').snapshots();`

  @override
  Widget build(BuildContext context) {
    return StreamBuilder<QuerySnapshot>(
      stream: _usersStream,
      builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (snapshot.hasError) {
          return const Text('Something went wrong');
        }

    if (snapshot.connectionState == ConnectionState.waiting) {
      return const LinearProgressIndicator();
    }


//this way you can extract your data from DB

//Of course it totally depend on if your data in Db is nested or not. just adjust it with your needs
    return ListView(
      children: snapshot.data!.docs.map((DocumentSnapshot document) {
        Map<String, dynamic> data =
            document.data()! as Map<String, dynamic>;
        return Column(children: [
          PassDataToAnotherWidget(data),
        ]);
      }).toList(),
    );
  },
);
  }
}

Answer 2

如果您在 Firebase 實時數據庫中有數據，您可以通過其onValue stream 監聽該數據的更新。 您可以使用 StreamBuilder 在小部件樹中使用此StreamBuilder ：

@override
Widget build(BuildContext context) {
  var ref = FirebaseDatabase.instance.ref('path_to_value');
  return Scaffold(
    StreamBuilder(
      stream: ref.onValue,
      builder: (context, snapshot) {
        if (snapshot.hasData) return Text(snapshot.data!.snapshot.value);
        if (!snapshot.hasData) return CircularProgressIndicator();
        if (snapshot.hasError) return Text(snapshot.error);
      }
    )
  )

我推薦觀看這個很棒的代碼視頻： Firebase 實時數據庫和 Flutter - Firecasts