Flutter 輸出Google Firebase 資料

Firebase ,具備完整的數據分析、當機回報、Test Lab、通知、Google 代碼管理工具和遠端設定功能。 所有的Google 使用者都可以利用這類專案來查看實際的應用程式資料,以及探索Firebase 功能組合近年來Google很推廣使用Firebase進行APP管理,Firebase包含驗證該如何將Firebase裡面的資料進行輸出打印在除錯視窗上嗎?

Firebase 資料結構

Firebase Document1 

Firebase Document2 

Firebase 程式

透過這個自建來調用Firebase裡面的內容。

Future<void> getMessagesTestTest() async{

    var aa = await _firestore.collection('ProductModel').snapshots().map((notes){
      notesFromFirestore.clear();
      for(final DocumentSnapshot<Map<String,dynamic>> doc in notes.docs){
        log("start in loop");
        log('doc.id == ${doc.id}');
        // print("start in loop");
        // print('doc.id == ${doc.id}');
        notesFromFirestore.add(ProductModel.fromDocumentSnapshot(doc:doc));
        // print(ProductModel.fromDocumentSnapshot(doc:doc));
      }
      // print(notesFromFirestore.first.id.toString());
      return notesFromFirestore;});
    // int count = await allData.length;
    aa.listen(
          (event) => print("Data Retrieved"),
    );
    // print(aa.length);
    print( 'List Size = ${notesFromFirestore.length}');
    var count = 0;
    for (final ProductModel notesFromFirestoreA in notesFromFirestore) {
      count++;
      print('Loop Counter == ${count}');
      print('Id == ${notesFromFirestoreA.id}');
      print('Name == ${notesFromFirestoreA.name}');
      print('Price == ${notesFromFirestoreA.price}');
      print('Brand == ${notesFromFirestoreA.brand}');
      print('image == ${notesFromFirestoreA.image}');
    }
  }

這裡主畫面不進行相對應的渲染,僅去調用上面寫的功能。

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Record'),
        leading: null,
        actions: <Widget>[
          IconButton(
            icon: const Icon(Icons.add),
            onPressed: (){
              Navigator.pushNamed(context, creationCategory.id);
            },
          ),
          IconButton(
            icon: const Icon(Icons.settings),
            onPressed: () async {
              // await getData();
              getMessagesTestTest();
              // Navigator.push(
              //   context,
              //   MaterialPageRoute(builder: (context) => const ItemDetailsScrrent()),
              // );
            },
          ),
        ],
      ),
      body: SafeArea(
        child: Container(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[

              Text('Trahs Collection',
              style: const TextStyle(
                color: Colors.black38, fontWeight: FontWeight.bold, fontSize: 40),
              ),
              ItemStream(),
            ],
          ),
          ),
      ),
      );

  }

定義類別:

class ProductModel {
  static const ID = "id";
  static const IMAGE = "image";
  static const NAME = "name";
  static const BRAND = "brand";
  static const PRICE = "price";

  String? id;
  String? image;
  String? name;
  String? brand;
  int? price;

  ProductModel(
      {required this.id,
        required this.image,
        required this.name,
        required this.brand,
        required this.price});

  factory ProductModel.fromFire(QueryDocumentSnapshot snapshot) {
    return ProductModel.fromMap(snapshot as Map<String, dynamic>);
  }
  factory ProductModel.fromDocumentSnapshot({required DocumentSnapshot<Map<String,dynamic>> doc}){
    // print(doc.data()!["id"]);
    // print(doc.data()!["image"]);
    // print(doc.data()!["name"]);
    // print(doc.data()!["brand"]);
    // print(doc.data()!["price"]);
    return ProductModel(
      id: doc.data()!["id"],
      image: doc.data()!["image"],
      name: doc.data()!["name"],
      brand: doc.data()!["brand"],
      price: doc.data()!["price"],
    );
  }

  Map<String, dynamic> toJson() => {
    'id': id,
    'image': image,
    'name': name,
    'brand': brand,
    'price': price,
  };

  ProductModel.fromMap(Map<String, dynamic> data) {
    id = data[ID];
    image = data[IMAGE];
    name = data[NAME];
    brand = data[BRAND];
    price = data[PRICE];
  }
}

這邊因為裡面有兩個文件,透過此方式進行輸出作業。

相關參考連結: