首页 > 解决方案 > 无法使用 Listview.Builder 和 ListTile 显示从 Firestore 下载的数据

问题描述

我想显示从 firestore 下载数据的列表。下载成功(可以打印完整列表),但不知何故无法显示。当我使用 ListView.builder 和 ListTile 时,根本没有显示任何内容。请帮助我的代码有什么问题。太谢谢了。


class DownloadDataScreen extends StatefulWidget {

  @override
  List<DocumentSnapshot> carparkList = []; //List for storing carparks

  _DownloadDataScreen createState() => _DownloadDataScreen();
}

class _DownloadDataScreen extends State<DownloadDataScreen> {
  void initState() {
    super.initState();
    readFromFirebase();
  }

  void readFromFirebase() async {
    await FirebaseFirestore.instance
        .collection('carpark')
        .get()
        .then((QuerySnapshot snapshot) {
      snapshot.docs.forEach((DocumentSnapshot cp) {
        widget.carparkList.add(cp);

        //to prove data are successfully downloaded
        print('printing cp');
        print(cp.data());
        print(cp.get('name'));
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(
          'Car Park',
          style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
        ),
        centerTitle: true,
      ),
      body: SafeArea(
        child: Column(
          children: [
            Expanded(
              flex: 9,
              child: Container(
                child: ListView.builder(
                  itemCount: widget.carparkList.length,
                  itemBuilder: (context, index) {
                    return ListTile(
                      title: Text(widget.carparkList[index].get('name')),
                      subtitle: Text(
                      widget.carparkList[index].get('district')),
                      onTap: () {
                      },
                    );
                  },
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

标签: flutter

解决方案


在 state 中创建列表将其添加到 initState 方法的顶行 List carparkList = [];

class DownloadDataScreen extends StatefulWidget {


  _DownloadDataScreen createState() => _DownloadDataScreen();
}

class _DownloadDataScreen extends State<DownloadDataScreen> {

 List<DocumentSnapshot> carparkList = []; //List for storing carparks

  void initState() {
    super.initState();
    readFromFirebase();
  }

  void readFromFirebase() async {
    await FirebaseFirestore.instance
        .collection('carpark')
        .get()
        .then((QuerySnapshot snapshot) {
      snapshot.docs.forEach((DocumentSnapshot cp) {
        widget.carparkList.add(cp);

        //to prove data are successfully downloaded
        print('printing cp');
        print(cp.data());
        print(cp.get('name'));
      });
    });
  }

推荐阅读