在Flutter中从Firebase检索数组

问题描述

我想从firebase或cloud_firestore中检索数组。 我检索单个数据没有问题，但是 检索数组数据 有问题 请帮助我的初学者处于爆炸的边缘。 我已经在Google上搜索了很多教程视频，但找不到解决方法

database image here

pubspec.yaml
dependencies:
  
  cloud_firestore: ^0.13.6

main.dart

import 'package:Flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
 return MaterialApp(
   debugShowCheckedModeBanner: false,title: 'Flutter Demo',theme: ThemeData(
     primarySwatch: Colors.blue,visualDensity: VisualDensity.adaptivePlatformDensity,),home: Scaffold(
     appBar: AppBar(title: Text("Flutter Fire CRUD")),body: ListPage(),);
}
}

class ListPage extends StatefulWidget {
@override
_ListPageState createState() => _ListPageState();
}

class _ListPageState extends State<ListPage> {
Future _data;
Future getUsers() async {
 var firestore = Firestore.instance;
 firestore.collection("users").getDocuments();
 QuerySnapshot qn = await firestore.collection("users").getDocuments();
 return qn.documents;
}

navigatetoDetail(DocumentSnapshot users) {
 Navigator.push(context,MaterialPageRoute(builder: (context) => DetailList(users: users)));
}

@override
void initState() {
 super.initState();

 _data = getUsers();
}

@override
Widget build(BuildContext context) {
 return Container(
   child: FutureBuilder(
     future: _data,builder: (context,snapshot) {
       if (snapshot.connectionState == ConnectionState.waiting) {
         return Text("Loading ...");
       } else {
         return ListView.builder(
           itemCount: snapshot.data.length,itemBuilder: (context,index) {
             return ListTile(
                 title: Text(snapshot.data[index].data['name']),onTap: () {
                   navigatetoDetail(snapshot.data[index]);
                 });
           },);
       }
     },);
}
}

class DetailList extends StatefulWidget {
final DocumentSnapshot users;

DetailList({Key key,@required this.users}) : super(key: key);
@override
_DetailListState createState() => _DetailListState();
}

class _DetailListState extends State<DetailList> {

@override
Widget build(BuildContext context) {
 return Scaffold(
   appBar: AppBar(
     title: Text("${widget.users.data['name']}"),body: Column(
     children: [
       Container(
         height: MediaQuery.of(context).size.height / 2.0,width: MediaQuery.of(context).size.width,child: Center(
           child: Image.network(widget.users.data["img"]),Container(
         child: Card(
           child: ListTile(
             title: Text(widget.users.data["name"]),subtitle: Text("Age:" + widget.users.data["age"]),ListView.builder(
         itemCount: widget.users.data["skills"],index) {
           return ListTile(
             //title: Text(widget.users.data["skills"][index]),title: here............
           );
         },)
     ],);
}
}

解决方法

           StreamBuilder(
                  stream: Firestore.instance
                      .collection('users')
                      .document(id)
                      .collection('chatWith')
                      .orderBy('timestamp',descending: true)
                      .snapshots(),builder: (context,snapshot) {
                    if (!snapshot.hasData) {
                      return Center(
                        child: CircularProgressIndicator(
                          valueColor: AlwaysStoppedAnimation<Color>(
                              AppColor.colorCustom),),);
                    } else {
                      if (snapshot.data.documents.length == 0) {
                        return Container(
                          alignment: Alignment.center,child: Text(
                            "No Chat History Found",style: TextStyle(
                              color: Colors.grey,fontWeight: FontWeight.normal,fontSize:
                                  Util.px_23 * SizeConfig.textMultiplier,fontFamily: 'Roboto',softWrap: true,);
                      } else {
                        return ListView.builder(
                          padding: EdgeInsets.all(
                              Util.px_10 * SizeConfig.heightMultiplier),itemBuilder: (context,index) => _listItem(
                              context,snapshot.data.documents[index]),itemCount: snapshot.data.documents.length,);
                      }
                    }
                  },)

您可以从Firestore中获取数据列表。我在项目中使用的这段代码。您可以根据需要进行修改。