Firebase中ListView.builder始终显示loading问题求助

API 探路者

2026-8-12

问题分析与修复

你的代码一直显示loading，核心问题有两个：

没有返回ListView组件：在ConnectionState.done的分支里，你创建了ListView.builder但没有用return返回它，所以不管逻辑执行到哪，函数最后都会走到末尾的return Text("loading")。
多余的异步操作：data['friends']是Firestore文档里直接存储的数组，不需要用await获取，你写的waitList函数完全没用，还会造成变量赋值的混乱。

修复后的代码

Widget showFriend() {
  CollectionReference users = FirebaseFirestore.instance.collection('todos');
  return FutureBuilder<DocumentSnapshot>(
    future: users.doc(documentId).get(),
    builder: (BuildContext context, AsyncSnapshot<DocumentSnapshot> snapshot) {
      if (snapshot.hasError) {
        return const Text("Something went wrong");
      }

      if (snapshot.hasData && !snapshot.data!.exists) {
        return const Text("Document does not exist");
      }

      if (snapshot.connectionState == ConnectionState.done) {
        Map<String, dynamic> data = snapshot.data!.data() as Map<String, dynamic>;
        // 直接从data里取出friends数组，不需要异步操作
        List<dynamic> fren = List.from(data['friends'] ?? []); // 加空值判断避免崩溃
        print(fren);
        
        if (fren.isNotEmpty) {
          // 这里一定要return ListView
          return ListView.builder(
            itemCount: fren.length,
            itemBuilder: (context, index) {
              return ListTile(title: Text('${fren[index]}'));
            },
          );
        } else {
          // 处理friends为空的情况，返回提示
          return const Text("暂无好友");
        }
      }

      // 只有当连接未完成时才显示loading
      return const Text("loading");
    },
  );
}