Flutter Firestore点击列表项获取子集合特定文档的实现

你可以通过两种方式实现点击列表项获取对应数据的需求，具体如下：

方式一：直接传递文档数据到目标页面 #

这种方式适合数据无需实时更新的场景，直接把当前列表项的Firestore文档数据传递到Profile页面。

1. 修改Profile页面，添加数据接收构造函数

class Profile extends StatelessWidget {
  // 定义接收密码数据的变量
  final Map<String, dynamic> passwordData;

  // 构造函数接收数据
  const Profile({Key? key, required this.passwordData}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // 直接使用passwordData获取对应字段
    return Scaffold(
      appBar: AppBar(title: Text(passwordData['appname'])),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text('应用名称: ${passwordData['appname']}'),
            SizedBox(height: 8),
            Text('账号: ${passwordData['username']}'),
            SizedBox(height: 8),
            Text('密码: ${passwordData['password']}'),
            // 根据你的集合字段添加更多内容
          ],
        ),
      ),
    );
  }
}

2. 修改首页列表项的onTap事件，传递数据
   把当前passw文档的数据传入Profile页面：

onTap: () {
  Navigator.of(context).push(MaterialPageRoute(
      builder: (context) => Profile(
            passwordData: passw.data() as Map<String, dynamic>,
          )));
}

方式二：传递文档ID，在目标页面重新查询数据 #

如果需要实时获取最新的文档数据（比如数据可能被其他端修改），可以传递文档ID到Profile页面，再从Firestore重新查询。

1. 修改Profile页面，接收文档ID和用户UID

class Profile extends StatelessWidget {
  final String docId;
  final String userId;

  const Profile({Key? key, required this.docId, required this.userId}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return StreamBuilder<DocumentSnapshot>(
      // 通过文档ID监听该条数据的实时变化
      stream: FirebaseFirestore.instance
          .collection("users")
          .doc(userId)
          .collection("passwordProfile")
          .doc(docId)
          .snapshots(),
      builder: (context, snapshot) {
        if (!snapshot.hasData) {
          return Center(child: Text('加载中'));
        }
        // 获取文档数据
        var passwordData = snapshot.data!.data() as Map<String, dynamic>;
        return Scaffold(
          appBar: AppBar(title: Text(passwordData['appname'])),
          body: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text('应用名称: ${passwordData['appname']}'),
                SizedBox(height: 8),
                Text('账号: ${passwordData['username']}'),
                SizedBox(height: 8),
                Text('密码: ${passwordData['password']}'),
              ],
            ),
          ),
        );
      },
    );
  }
}

2. 修改首页列表项的onTap事件，传递ID参数

onTap: () {
  Navigator.of(context).push(MaterialPageRoute(
      builder: (context) => Profile(
            docId: passw.id, // 获取当前文档的ID
            userId: firebaseuser!.uid,
          )));
}

内容的提问来源于stack exchange，提问作者Tron Yung king