时间戳

首页 > 解决方案 > 来自 Firestore 的数据未显示在列表视图中

firebase - 来自 Firestore 的数据未显示在列表视图中

问题描述

我在 Firestore 上有这些数据： 在此处输入图像描述

我正在使用此代码从每个文档中获取“名称”以显示在列表视图中：

Widget buildUserList(BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
if (snapshot.hasData) {
    return ListView.builder(
        itemCount: snapshot.data.documents.length,
        itemBuilder: (context, index) {
            DocumentSnapshot user = snapshot.data.documents[index];

            return ListTile(
                // Access the fields as defined in FireStore
                title: Text(user.data['name']),
            );
        },
    );
} else if (snapshot.connectionState == ConnectionState.done && !snapshot.hasData) {
    // Handle no data
    return Center(
        child: Text("No users found."),
    );
} else {
    // Still loading
    return CircularProgressIndicator();
}
}

并在正文中显示它：

StreamBuilder(
    stream:
        Firestore.instance.collection('markers').snapshots(),
    builder: buildUserList,
)

问题是列表视图是空的。我能做些什么来解决这个问题？

标签： firebaseflutterdartgoogle-cloud-firestore

解决方案

好的，当我运行您的代码时，我遇到了两个错误。第一个是 ListView 需要有一个有界的高度，这可以通过容器或大小的框小部件轻松完成。下面的固定代码示例将有一个容器来限制高度。另一个问题是 ListTile 小部件需要在小部件树中具有 Material 小部件，并且您的小部件树中可能已经有一个材质小部件，但您的问题中没有包含该小部件，但如果没有，下面的代码示例也将解决该问题问题也是如此。希望这会有所帮助！如果您有任何问题，请发表评论！

Widget buildUserList(BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
    if (snapshot.hasData) {
        return Container(
          height: 350,
          child: ListView.builder(
              itemCount: snapshot.data.documents.length,
              itemBuilder: (context, index) {
                  DocumentSnapshot user = snapshot.data.documents[index];

                  return Material(
                    child: ListTile(
                        // Access the fields as defined in FireStore
                        title: Text(user.data['first name']),
                    ),
                  );
              },
          ),
        );
    } else if (snapshot.connectionState == ConnectionState.done && !snapshot.hasData) {
        // Handle no data
        return Center(
            child: Text("No users found."),
        );
    } else {
        // Still loading
        return CircularProgressIndicator();
    }
  }

推荐阅读