Listview 如何使用Future Builder从Cloud FireStore创建包含数据的列表

我正在尝试创建一个带有列表视图的Flutter应用程序，该列表视图从CloudFireStore检索数据。我遇到了未来建设者的问题。请在下面找到我的代码：

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:awesome_loader/awesome_loader.dart';
import 'package:cloud_firestore/cloud_firestore.dart';

void main() => runApp(OfferPage());

class OfferPage extends StatefulWidget {
@override
_OfferPageState createState() => _OfferPageState();
}

class _OfferPageState extends State<OfferPage> {
@override
Widget build(BuildContext context) {
return MaterialApp(
    debugShowCheckedModeBanner: false,
    theme: ThemeData(primaryColor: Colors.green[900]),
    home: Scaffold(
      appBar: AppBar(
        title: Text('Click a Deal'),
        centerTitle: true,
        backgroundColor: Colors.green[900],
      ),
      body: OfferScroll(),
    ));
    }
     }

    class OfferScroll extends StatefulWidget {
    @override
    _OfferScrollState createState() => _OfferScrollState();
     }

    class _OfferScrollState extends State<OfferScroll> {

     Future getOffers() async {
     var firestore = Firestore.instance;
     QuerySnapshot qn = await firestore.collection("Offers").getDocuments();
     return qn.documents;
    }

    @override
    Widget build(BuildContext context) {
       return Container(
          child: FutureBuilder(
          future: getOffers(),
          builder: (_, snapshot) {
          if (snapshot.connectionState == ConnectionState.waiting) {
              return Center(
                 child: AwesomeLoader(
                 loaderType: AwesomeLoader.AwesomeLoader3,
                 color: Colors.green[900],
            ),
          );
        } else {
          ListView.builder(
              itemCount: snapshot.data.length,
              itemBuilder: (_, index) {
                return ListTile(
                    title: Text(snapshot.data[index].data["title"]));
              });
        }
      }),
);
}
}

导入“包装：颤振/材料.省道”；
导入“dart:async”；
导入“包：awesome_loader/awesome_loader.dart”；
导入“包：cloud_firestore/cloud_firestore.dart”；
void main（）=>runApp（OfferPage（））；
类OfferPage扩展了StatefulWidget{
@凌驾
_OfferPageState createState（）=>OfferPageState（）；
}
类_OfferPageState扩展了状态{
@凌驾
小部件构建（构建上下文）{
返回材料PP(
debugShowCheckedModeBanner:false，
主题：主题数据（原色：Colors.green[900]），
家：脚手架(
appBar:appBar(
标题：文本（“点击交易”），
标题：对，
背景颜色：颜色。绿色[900]，
),
正文：OfferScroll（），
));
}
}
类OfferScroll扩展StatefulWidget{
@凌驾
_OfferScrollState createState（）=>\u OfferScrollState（）；
}
类_OfferScrollState扩展状态{
Future getOffers（）异步{
var firestore=firestore.instance；
QuerySnapshot qn=wait firestore.collection（“Offers”）.getDocuments（）；
返回qn文件；
}
@凌驾
小部件构建（构建上下文）{
返回容器(
孩子：未来建设者(
future:getOffers（），
构建器：（\uux，快照）{
if（snapshot.connectionState==connectionState.waiting）{
返回中心(
孩子：可怕的加载器(
loaderType:AwesomeLoader.AwesomeLoader3，
颜色：颜色。绿色[900]，
),
);
}否则{
ListView.builder(
itemCount:snapshot.data.length，
itemBuilder:（\ux，索引）{
返回列表块(
标题：文本（快照.数据[索引].数据[“标题]）；
});
}
}),
);
}
}

我遇到了以下错误：

生成FutureBuilder时抛出了以下断言（脏，状态：_FutureBuilderState#ea2bc）： 生成函数返回null

令人反感的小部件是：FutureBuilder 构建函数不能返回null

要返回导致建筑小部件填满可用空间的空白空间，请返回“Container（）”。要返回占用空间尽可能小的空白空间，请返回“Container（宽度：0.0，高度：0.0）”

---

必须在ListView.builder之前添加一个返回值，否则else分支将返回null：

return ListView.builder(
    itemCount: snapshot.data.length,
    itemBuilder: (_, index) {
        return ListTile(
            title: Text(snapshot.data[index].data["title"]));
    },
);

---

谢谢@MarcelGeirhos，只是忘了加上这个。编程新手不是问题的正确解决方案？当它是正确的解决方案时，请接受答案。：）请检查我的其他帖子，我需要它工作：我想你应该查找NetworkImage来加载一个图像，然后你可以引用你想要显示的图像url。当你在FireStore中以字符串形式显示url时，我想你可以用这样的人检索url：snapshot.data[index].data['imageFieldName']然后您可以将此（URL）返回给NetworkImage以显示该图像。