Question

我正在尝试弄清如何遍历firestore中的文档并为每个文档创建一个文本小部件。

我已经弄清楚了如何访问那些元素。我使用了debugPrint（）并获得了预期的结果，但无法在其他小部件下方显示它。我在电话上看到红屏，上面有很多错误。下面是到目前为止我尝试过的代码。


   QuerySnapshot querySnapshot = await 
Firestore.instance.collection("users").document(user.uid).collection("trails").getDocuments();
        var list = querySnapshot.documents;
list.forEach((doc) =>  debugPrint(doc.data["Trail Name"].toString()));//works
final topContentText = Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
      //these widgets are generating correctly  
      Text(
          "First Name: $firstName",
          style: TextStyle(color: Colors.white, ),
        ),
        Text(
          "Last Name: $lastName",
          textAlign: TextAlign.left,
          style: TextStyle(color: Colors.white,),
        ),
        Text(
          "Email: $email",
          style: TextStyle(color: Colors.white, ),
        ),
     //these ones are causing my errors.
    list.forEach((doc) =>  Text(
      "Trail Name: ${doc.data["Trail Name"].toString()}",
      style: TextStyle(color: Colors.white, ),
    ),)
      ],
    );

    final topContent = Stack(
      children: <Widget>[
        Container(
          height: MediaQuery.of(context).size.height * 0.40,
          padding: EdgeInsets.all(40.0),
          width: MediaQuery.of(context).size.width,
          decoration: BoxDecoration(color: Color.fromRGBO(58, 66, 86, .9)),
          child: Center(
            child: topContentText,
          ),
        ),
        Positioned(
          left: 8.0,
          top: 60.0,
          child: InkWell(
            onTap: () {
              Navigator.pop(context);
            },
            child: Icon(Icons.arrow_back, color: Colors.white),
          ),
        )
      ],
    );
    return Scaffold(
      body: Column(
        children: <Widget>[topContent, bottomContent],
      ),
    );

当我期望设备的屏幕在其他信息下方显示跟踪名称时，设备的屏幕会亮红色，并显示创建子窗口小部件的错误。我仅包含必要的代码，但如果需要，可以包含更多代码（例如小部件的build方法）。感谢您的协助。我是新来的人。

Answer 1

尝试使用地图功能：

  List<Widget> _widgets = list.map((doc) =>  Text(
    "Trail Name: ${doc.data["Trail Name"].toString()}",
    style: TextStyle(color: Colors.white, ),
  ),).toList();

然后对于该列的子代，只需将该列表添加到您指定的列表中即可，例如：

children: [ ... ] + _widgets;

如何从Firebase Firestore数据库生成小部件列表？

1 个答案: