Question

我正在从Firestore检索数据并将其存储在GridView.builder中。数据包括图像和标题。我经历了这个问题和公认的解决方案（GridView with Flutter and Firestore），并遵循了很多视频教程，但没有成功。

 @override
  Widget build(BuildContext context) {
    return StreamBuilder(
      stream: FirebaseFirestore.instance.collection("dB name").limit(12)
          .orderBy("Published Date", descending: true).snapshots(),
      builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
        if (!snapshot.hasData) {
          return spinkit;
        }
        return Expanded(
          child: Flex(
              direction: Axis.vertical,
              children: [
                GridView.builder(
                  physics: ScrollPhysics(),
                  scrollDirection: Axis.vertical,
                  shrinkWrap: true,
                  itemCount: snapshot.data.docs.length,
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3,
                    crossAxisSpacing: 10.0,
                    mainAxisSpacing: 10,
                  ),
                  itemBuilder: (BuildContext context, int index) {
                    return ClipRRect(
                      borderRadius: BorderRadius.circular(5),
                      child: Stack(
                        children: [
                          Container(
                            height: 150,
                            width: 150,
                            child: Image.network(snapshot.data()['thumbnail'],
                              fit: BoxFit.cover,
                              width: double.infinity,
                              height: double.infinity,
                            ),
                          ),
                          Positioned(
                            left: 0,
                            bottom: 0,
                            child: Container(
                              height: 20,
                              width: 150,
                              decoration: BoxDecoration(
                                  gradient: LinearGradient(
                                    colors: [
                                      Colors.black38,
                                      Colors.black38,
                                    ],
                                    begin: Alignment.bottomCenter,
                                    end: Alignment.topCenter,
                                  )
                              ),
                            ),
                          ),
                          Positioned(
                            left: 4,
                            bottom: 5,
                            child: Text(snapshot.data().documents[index]['Product Title'],
                              overflow: TextOverflow.ellipsis,
                              style: TextStyle(
                                  color: Palette.whiteColor,
                                  fontSize: 11,
                                  fontWeight: FontWeight.bold
                              ),),
                          )
                        ],
                      ),
                    );
                  },
                ),
              ]),
        );
      },

    );
  }

以下是正在收到错误消息

引发了另一个异常：NoSuchMethodError：类'QuerySnapshot'没有实例方法'call'。

════════ Exception caught by widgets library ═══════════════════════════════════════════════════════
Class 'QuerySnapshot' has no instance method 'call'.
Receiver: Instance of 'QuerySnapshot'
Tried calling: call()
════════════════════════════════════════════════════════════════════════════════════════════════════

下面是数据库的快照。

这也是另一个错误

Answer 1

您可以使用getString('')：

snapshot.data.documents [index] .get（'产品标题'）

Here是关于它的文档

Answer 2

根据本文档Here

，这就是我解决此问题的方式

此为图片

Image.network（snapshot.data.documents [index] .get（'缩略图'），

此为文字

文本（snapshot.data.documents [index] .get（'产品标题'），

感谢@Joss Baron

从Firestore检索数据并在GridView.builder flutter中显示

2 个答案: