Flutter如何将Firebase Storage多张图片URL存入Firebase Database同一集合

• 代码执行顺序错误：先提交了表单数据到Firestore，此时图片还未上传完成，_uploadedFileUrl 还没有拿到有效地址，且你初始仅配置了单个URL字段存储图片地址
• 每上传完一张图片就调用 hwFormData.add()，这个方法的作用是新增一条独立的文档，不是往已创建的同一条表单文档中追加数据，自然无法把所有URL归集到同一条数据里
• 使用单个变量 _uploadedFileUrl 存储URL，每次上传新图片都会覆盖之前的地址，最终只能保留最后一张图片的URL

先完成所有图片的上传，收集到全部URL之后，再一次性把表单内容+所有图片URL提交到Firestore即可，参考代码如下：

var title = '';
var pageNo = 0;
var description = '';
// 将单个图片URL变量改为数组，存储所有图片的下载地址
List<String> imgUrls = [];

Future sendData() async {
  // 第一步：上传所有图片，收集全部下载URL
  firebase_storage.Reference ref;
  for (var img in _image) {
    ref = firebase_storage.FirebaseStorage.instance
        .ref()
        .child('hwImages/${Path.basename(img.path)}');
    await ref.putFile(img);
    // 拿到单张图片的下载地址，存入数组
    String downloadUrl = await ref.getDownloadURL();
    imgUrls.add(downloadUrl);
  }

  // 第二步：所有图片上传完成后，一次性提交表单+全部图片URL到Firestore
  try {
    await hwFormData.add({
      'title': title,
      'pageNo': pageNo,
      'description': description,
      // 存储数组类型的imgUrls字段，包含所有上传的图片地址
      'imgUrls': imgUrls,
    });
    print('Form data sent');
    _key.currentState!.reset();
    // 提交完成后清空URL数组，避免下次提交带入旧数据
    imgUrls.clear();
    setState(() {});
  } catch (error) {
    print('Failed to send data: $error');
  }
}

• 修复后imgUrls字段在Firestore中为数组类型，读取数据时直接遍历该数组即可拿到所有上传的图片地址
• 如果你后续需要给已存在的文档追加图片URL，不要使用add()方法，调用doc(目标文档ID).update({'imgUrls': FieldValue.arrayUnion([新的URL])})即可往已有数组中追加元素，不会覆盖原有数据
• 如果你需要将每个图片URL作为独立文档存在表单文档的子集合中，可在创建完主表单文档后拿到文档ID，遍历imgUrls数组往hwFormData.doc(文档ID).collection('imgUrls')中逐个添加即可

内容的提问来源于stack exchange，提问作者Botshelo Ramela