firebase - Flutter / Firebase - 列出重复firebase数组值的Tile

Question

我正在使用 firebase 作为数据源在垂直列表视图中创建水平列表视图。我已经创建了我的垂直列表视图（带有 Firestore 文档），但我现在需要访问每个文档中的字段（准确地说是数组）并使用这些值创建列表图块。我在firestore中的数据是这样存储的：

例如，周年纪念列表图块应该是“男朋友”和“女朋友”（更多要添加），但目前，当我创建列表图块时，它们会填充每个文档中的每个数组：

生日应该只包含“18th”和“21st”，周年纪念“男朋友”/“女朋友”等

到目前为止，这是我的飞镖代码：

   class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: const Size.fromHeight(80),
        child: MainAppBar(
          text: 'Pick an occasion...',
        ),
      ),
      body: StreamBuilder(
        stream: Firestore.instance
            .collection('events')
            .orderBy('order')
            .snapshots(),
        builder: buildProductList,
      ),
    );
  }
}

Widget buildProductList(
    BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
  if (snapshot.hasData) {
    return ListView.builder(
      scrollDirection: Axis.vertical,
      shrinkWrap: true,
      itemCount: snapshot.data.documents.length,
      itemBuilder: (context, index) {
        DocumentSnapshot user = snapshot.data.documents[index];
        print(user['Occasions'].runtimeType);
        print(user.documentID);
        return Column(
          children: [
            ListTile(
                leading: Image(
                  image: FirebaseImage(user.data['img_url']),
                  height: 25,
                  width: 25,
                ),
                // Access the fields as defined in FireStore
                title: Transform(
                    transform: Matrix4.translationValues(-20, 0.0, 0.0),
                    child: Text(user.documentID))),
            Container(
              margin: EdgeInsets.only(left: 8.0),
              height: 150.0,
              child: ListView(
                scrollDirection: Axis.horizontal,
                    children: snapshot.data.documents.map((document) {
                      return Container(
                        height: 150,
                        width: 75.0,
                        child: new ListTile(
                          title: new Text(document['Occasions'].toString()),
                        ),
                      );
                    }).toList(),
                  ),
              )
          ],
        );
      },
    );
  } else if (snapshot.connectionState == ConnectionState.done &&
      !snapshot.hasData) {
    // Handle no data
    return Center(
      child: Text("No products found."),
    );
  } else {
    // Still loading
    return CircularProgressIndicator();
  }
}

这是我希望输出的样子：

有任何想法吗？