Flutter Firebase获取文档列表时异步返回空列表的问题如何解决？

问题原因 #

你的代码核心问题是没有正确等待异步操作执行完成，两处核心错误：

1. ref.snapshots() 返回的是Firestore的实时数据流Stream，你调用forEach监听流回调时没有加await，函数不会等回调执行完就直接走到return语句，此时返回的列表还未被填充数据。
2. onPressed回调中拿到plist这个Future实例时也没有等待执行完成，直接打印只能拿到Future本身，无法获取最终返回的列表值。

解决方案 #

如果你需要一次性获取当前的商品列表（不需要实时监听数据更新），推荐使用专门用于单次查询的get()方法，修改代码如下：

1. 修改getProducts2方法 #

Future<List<Product>> getProducts2() async {
  CollectionReference ref = _firestore.collection('Products');
  List<Product> productsArray = [];
  // 加await等待单次查询完成
  QuerySnapshot querySnapshot = await ref.get();
  // 遍历所有查询到的文档
  for (var doc in querySnapshot.docs) {
    Product p = Product.fromSnapshot(doc);
    productsArray.add(p);
    print("size: ${productsArray.length}");
  }
  print("+ size: ${productsArray.length}");
  return productsArray;
}

如果你确实要使用snapshots()方法仅获取一次数据，也可以等待流返回第一个值：var element = await ref.snapshots().first;，再遍历element.docs即可，不过get()是单次查询的最优方案，性能更高也不会产生多余的流订阅。

2. 修改onPressed回调 #

onPressed: () async {
  print("entered");
  ProductServices _productServives = ProductServices();
  // 加await等待Future执行完成，拿到最终的列表数据
  List<Product> plist = await _productServives.getProducts2();
  print(plist);
},

如果你需要实时监听商品列表的更新，不需要返回Future，直接在流的监听回调中更新UI状态即可，示例：

void listenProductUpdates() {
  CollectionReference ref = _firestore.collection('Products');
  // 监听流更新，每次数据变化都会触发回调
  ref.snapshots().listen((snapshot) {
    List<Product> productsArray = snapshot.docs.map((doc) => Product.fromSnapshot(doc)).toList();
    // 此处调用setState更新UI即可
    print("最新列表长度：${productsArray.length}");
  });
}

Flutter异步操作系统学习路径 #

• 先掌握Dart基础异步语法：熟悉Future、async、await的使用规则，理解Dart的事件循环机制，搞清楚微任务队列、事件队列的执行优先级。
• 再学习Stream相关知识：了解单订阅流、广播流的区别，掌握listen、map、where等常用流操作符的用法，以及StreamBuilder组件在Flutter UI中结合流渲染的实现方式。
• 结合实际场景实操：可以通过网络请求、本地数据库读写、第三方SDK调用等场景练习异步代码的编写，巩固知识点。

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