Flutter 网络应用程序：快照 returns 空值

Question

我是 flutter 的新手，一直在尝试从 firebase 检索数据并显示，但它的快照为空。我已经解决了其他用户提出的类似问题，但没有任何效果。

Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    leading: BackButton(
      color: Colors.white,
    ),
    bottomOpacity: 1.0,
    backgroundColor: mucolor1,
    title: Text(
      "Customer receipt ",
      style: TextStyle(color: Colors.white, fontSize: 12),
    ),
  ),
  body: Stack(
    clipBehavior: Clip.none,
    alignment: Alignment.topCenter,
    children: [
      Container(
        child: StreamBuilder(
          stream: FirebaseFirestore.instance
              .collection("users")
              .doc(tableNo)
              .collection("order")
              .snapshots(),
          builder: (BuildContext context,
              AsyncSnapshot<QuerySnapshot> snapshot) {
            if (snapshot.connectionState == ConnectionState.waiting)
              return new Center(child: new CircularProgressIndicator());

            if(snapshot.data!=null){
              return Container(
                margin: EdgeInsets.fromLTRB(20, 100, 20, 0),
                child: ListView(
                  children: snapshot.data.docs.map((document) {
                    return Container(
                        color: Colors.white54,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Card(
                              elevation: 0,
                              child: Container(
                                padding: EdgeInsets.all(10),
                                child: Row(
                                  mainAxisAlignment:
                                  MainAxisAlignment.spaceAround,
                                  children: [
                                    Text("Tsh " +
                                        document.get("price").toString() +
                                        "/="),
                                    Text(document.get("qty").toString()),
                                    Text(document.get("title")),


                                  ],
                                ),
                              ),
                            )
                          ],
                        ));
                  }).toList(),
                ),
              );
            }else {
              return Positioned(
                top: 80,
                child: Center(
                    child: Container(
                        margin: EdgeInsets.fromLTRB(20, 10, 20, 0),
                        child: Text("No data"))),
              );
            }

          },
        ),
      ),
      Positioned(
        top: 10,
        child: Center(
            child: Container(
                margin: EdgeInsets.fromLTRB(20, 10, 20, 0),
                child: Text("Your Order"))),
      ),
      Positioned(
          top: 50,
          child: Container(
              margin: EdgeInsets.fromLTRB(20, 10, 20, 0),
              child: Text(
                "Total Cost Tsh " + grandTotal + "/=",
                style:
                    TextStyle(color: mucolor2, fontWeight: FontWeight.bold),
              ))),
    ],
  ),
);

} }

这是我的数据库结构：

我需要你的帮助。我已经为解决这个问题苦苦挣扎了一个月。

Answer 1

您的 users 文件是空的；这意味着它的位置实际上没有文档。

在这种情况下，您应使用 collectionGroup('order') - https://firebase.google.com/docs/firestore/query-data/queries#collection-group-query

很好的参考：

Answer 2

我将 firebase SDK js 版本 8.2.1 替换为 7.22.1，它可以正常工作。

替换前。

SDK 8.2.1


  <script src="https://www.gstatic.com/firebasejs/8.2.1/firebase-app.js"></script>

  <script src="https://www.gstatic.com/firebasejs/8.2.1/firebase-firestore.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.2.1/firebase-analytics.js"></script>

SDK 7.22.1

  <script src="https://www.gstatic.com/firebasejs/7.22.1/firebase-app.js"></script>

  <script src="https://www.gstatic.com/firebasejs/7.22.1/firebase-firestore.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.22.1/firebase-analytics.js"></script>

现在可以使用了。

Flutter 网络应用程序：快照 returns 空值

Flutter webapp: Snapshort returns a null value

snapshot

google-cloud-firestore

stream-builder

flutter-web