Flutter中ListView点击元素获取Firestore文档ID的问题求助

问题根源 #

• 你在getArtists()里的循环会不断覆盖documentID变量，循环结束后自然只保留最后一个文档的ID，而且这个变量并没有被实际用到。
• 点击艺术家卡片时，没有获取当前点击项对应的文档ID，也没有将其传递给AlbumWidget。

修复方案 #

1. 移除无用的循环代码：getArtists()不需要单独遍历存ID，返回的QuerySnapshot.docs里每个DocumentSnapshot都自带id属性。
2. 在点击事件中获取并传递当前ID：在ListView.builder的itemBuilder中，先拿到当前项的DocumentSnapshot，然后在InkWell的onTap里获取其id，并传给AlbumWidget。

修改后的完整代码 #

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:flutter_application_1/screens/songspage.dart';
import 'package:flutter_application_1/screens/albums.dart';

class Home extends StatefulWidget {
  const Home({super.key});

  @override
  State<Home> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<Home> {
  CollectionReference _collectionRef = FirebaseFirestore.instance.collection('artist');

  var artist_id, album_id, song_id;
  
  // 简化getArtists函数，移除无用循环
  Future getArtists() async {
    QuerySnapshot querySnapshot = await FirebaseFirestore.instance.collection("artist").get();
    return querySnapshot.docs;
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: getArtists(),
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return const Center(
            child: CircularProgressIndicator(),
          );
        } else if (snapshot.hasError) {
          return Center(child: Text('加载出错: ${snapshot.error}'));
        } else {
          List<DocumentSnapshot> docs = snapshot.data as List<DocumentSnapshot>;
          return ListView.builder(
              itemCount: docs.length,
              itemBuilder: (context, index) {
                // 获取当前项的文档快照
                DocumentSnapshot artistDoc = docs[index];
                return InkWell(
                  // 点击时传递当前艺术家ID给AlbumWidget
                  onTap: () => Navigator.push(context,
                      MaterialPageRoute(builder: (context) => AlbumWidget(
                        artistId: artistDoc.id,
                      ))),
                  child: Card(
                    child: Padding(
                      padding: const EdgeInsets.all(10.0),
                      child: Text(
                        artistDoc["name"],
                        style: const TextStyle(fontSize: 15.0),
                      ),
                    ),
                    elevation: 10.0,
                  ),
                );
              });
        }
      },
    );
  }
}

额外说明 #

• 需确保AlbumWidget接收artistId参数，用于后续查询专辑：

  class AlbumWidget extends StatelessWidget {
    final String artistId;
    const AlbumWidget({super.key, required this.artistId});
  
    // 使用artistId从Firestore获取对应专辑数据
  }
  

• 添加了错误处理分支，提升应用的健壮性。

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