首页 > 解决方案 > Flutter Firebase 将两个集合数据合并到一个数组中并在小部件中显示数据

问题描述

我想在一个数组中加入两个集合数据并在 listView.builder 中显示结果

用户(UID、姓名、电子邮件、电话、经度、纬度)、

和旅行(用户 ID、日期、时间、价格、从、到)。

PS:这两个集合之间的关系是用户ID,

因此,我想为每个元素显示一张卡片,其中包含以下详细信息:

姓名、电子邮件、电话、日期、时间、从、到。

如何做到这一点?

    import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_auth/firebase_auth.dart';

class VoyagerModel {
  var firestore = FirebaseFirestore.instance;
  String de, vers, adress;
  DateTime dateTime;
  double price;
  User user;
  String time;
  createVoyage() async {
    await firestore.collection('voyages').add({
      'userId': this.user.uid,
      'de': this.de,
      'vers': this.vers,
      'date': this.dateTime,
      'time': this.time,
      'adress': this.adress,
      'prix': this.price
    });
  }
}

和用户模型

import 'package:cloud_firestore/cloud_firestore.dart';

class ClientModel {
  String ref = 'clients';

  createUser(
      {id,
      int number,
      String name,
      String email,
      double long,
      double lat}) async {
    await FirebaseFirestore.instance.collection('users').doc(id).set({
      'userId': id,
      'name': name,
      'email': email,
      'phone': number,
      'longitude': long,
      'latitude': lat
    }).catchError((err) => {print(err.toString())});
  }
}

标签: firebasefluttergoogle-cloud-firestore

解决方案


这就是你要找的东西?

List<VoyagerModel> voyagers = [];
List<User> users = [];

@override
void initState() {
  // Fill voyagers and users
  super.initState();
}

@override
  Widget build(BuildContext context) {
    return Container(
      child: ListView.builder(
        itemCount: users.length,
        itemBuilder: (context, index) {
          final user = users[index];
          final userVoyagers =
              voyagers
               .where((voyager) => voyager.user.id == user.id)
               .toList();

          return Column(
            children: userVoyagers.map((userVoyager) {
              return Card(
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    Text(user.name),
                    Text(user.email),
                    Text('${user.number}'),
                    Text(userVoyager.dateTime.toString()),
                    Text(userVoyager.de),
                    Text(userVoyager.vers),
                  ],
                ),
              );
            }).toList(),
          );
        },
      ),
    );
  }
}

推荐阅读