在 flutter 中使用 StreamBuilder 和 collectionrefrence 作为快照

Question

我是 flutter 的新手，我正在尝试使用 StreamBuilder 从 firebase cloud firestore 中检索类别列表到我的 flutter 应用程序中。我正在使用 flutter 2.8.0 和 cloud_firestore: ^3.1.7 这是我的 Firestore 文档：categories collection 这是我的代码：

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:harfanah/shared/loading.dart';

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

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

class _categoriesModState extends State<categoriesMod> {
  @override
  Widget build(BuildContext context) {
    return Scaffold (
      body: StreamBuilder(
        stream: FirebaseFirestore.instance.collection('categories').snapshots(),
        builder: (context, snapshot) {
          if(!snapshot.hasData) {
            return loading();
          }
          return ListView.builder(
            itemCount: ,
            itemBuilder: ,
          );
        },
      ),
    );
  }
}

我真的很困惑如何使用 ItemCount 和 ItemBuilder。我发现很多解决方案都说我应该使用这样的东西：itemCount: snapshot.data.documents.length 但它不起作用。数据甚至没有除这些之外的任何属性：data attributes

Answer 1

您需要指定 StreamBuilder 的类型，然后您可以使用 class QuerySnapshot:

中可用的 properties/methods

class _categoriesModState extends State<categoriesMod> {
  @override
  Widget build(BuildContext context) {
    return Scaffold (
      body: StreamBuilder<QuerySnapshot<Map<String,dynamic>>>(
        stream: FirebaseFirestore.instance.collection('categories').snapshots(),
        builder: (context, snapshot) {
          if(!snapshot.hasData) {
             return loading();
          }
          return ListView.builder(
            itemCount: snapshot.data!.docs.length,
            itemBuilder: (context,index){
              return ListTile(
                title: snapshot.data!.docs[index].data()["code"],
                leading: snapshot.data!.docs[index].data()["name"],
              );
            } ,
          );
        },
      ),
    );
  }
}

在 flutter 中使用 StreamBuilder 和 collectionrefrence 作为快照

use StreamBuilder with collectionrefrence as snapshot in flutter

firebase

flutter

google-cloud-firestore

stream-builder