Question

我正在尝试使用具有从Cloud Firestore检索数据的列表视图创建Flutter应用程序。我遇到了Future Builder的问题。在下面找到我的代码：

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"]));
              });
        }
      }),
);
}
}

我遇到此错误：

在构建FutureBuilder（dirty，state：_FutureBuilderState＃ea2bc）时引发了以下断言：构建函数返回null。

有问题的小部件是：FutureBuilder 构建函数绝不能返回null。

要返回使建筑物小部件填充可用空间的空白区域，请返回“ Container（）”。要返回占用尽可能少空间的空白空间，请返回“ Container（width：0.0，height：0.0）”。

Answer 1

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

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

如何使用Future Builder使用Cloud FireStore中的数据创建列表

1 个答案: