Flutter Firebase待办列表新增后页面不显示问题解决及用户关联教程推荐

问题根源 #

你的代码中存在集合名称大小写不一致的问题：

• 创建待办项时，写入的集合是"MyTodos"
• StreamBuilder监听数据的集合是"Mytodos"

Firebase Cloud Firestore的集合名称是大小写敏感的，这导致StreamBuilder监听的是一个空集合，因此页面无法显示已存储的待办数据。

修复方案 #

修改StreamBuilder中的集合名称，与创建时保持一致：

// 原代码
stream: FirebaseFirestore.instance.collection("Mytodos").snapshots(),

// 修改后
stream: FirebaseFirestore.instance.collection("MyTodos").snapshots(),

额外优化建议 #

添加错误处理逻辑，方便后续排查问题：

builder: (context, snapshots) {
  if (snapshots.hasError) {
    return Center(child: Text('加载失败: ${snapshots.error}'));
  }
  if (snapshots.hasData) {
    // 原列表渲染逻辑
  } else {
    return Center(child: CircularProgressIndicator());
  }
}

Firebase数据库与用户登录关联的教程推荐 #

• 参考Firebase官方Flutter文档，结合「用户认证」和「Cloud Firestore」章节学习：
  • 用户登录后，获取当前用户的uid（FirebaseAuth.instance.currentUser?.uid）
  • 方案1：为每个用户创建独立集合，比如users/{uid}/todos，存储该用户的待办数据
  • 方案2：在待办文档中添加userId字段，查询时通过where('userId', isEqualTo: currentUserUid)过滤数据，实现用户数据隔离

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