Flutter：如何使用 ListViewBuilder 从 streambuilder/futurebuilder 中的 firebase 实时数据库中获取（全部）子数据？答案

【问题标题】：Flutter: How to fetch (all) of a child data from firebase realtime database in streambuilder/futurebuilder with ListViewBuilder?Flutter：如何使用 ListViewBuilder 从 streambuilder/futurebuilder 中的 firebase 实时数据库中获取（全部）子数据？
【发布时间】：2022-01-20 02:55:52
【问题描述】：

我正在尝试通过 ListView.builder() 从 StreamBuilder 或 FutureBuilder 中的实时数据库中获取所有子（“用户”）数据，但不幸的是它总是返回 null！

那我该怎么做呢？

这是我尝试做的：

import 'package:flutter/material.dart';
import 'package:firebase_database/firebase_database.dart';


class HomeWidget extends StatelessWidget {
  const HomeWidget({ Key? key }) : super(key: key);

  @override
  Widget build(BuildContext context) {
     final dbRef = FirebaseDatabase.instance.ref().child("users");

    return FutureBuilder(
      future: dbRef.once(),
      builder: (ctx, AsyncSnapshot snapshot){
        if(snapshot.connectionState == ConnectionState.waiting){
                return const Center(child: CircularProgressIndicator());
              }
        if(snapshot.hasData){
final userS = snapshot.data!.snapshot.value;
          return ListView.builder(
            itemCount: userS.length,
            itemBuilder: (BuildContext ctx, i)=> Container(
              height: 100,
              width: 100,
              child:  Card(
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
                child: Column(
                  children: [
                    Text(userS[i]['username']),
                    Text(userS[i]['password'])
                  ],
                ),
              ),
            ),
            );
        }
        return const Center(child: Text('There is something wrong!'),);
      },
      );
  }
}

enter image description here

【问题讨论】：

请在您的问题中以文本形式包含错误消息。包含屏幕截图实际上应该只针对无法在文本中捕获的内容（例如布局问题的屏幕截图）。

标签： flutter firebase-realtime-database

【解决方案1】：

您的应用中的此代码：

final userS = snapshot.data!.snapshot.value

您正在获取DataSnapshot object 的值，在您的情况下将是Map<String, dynamic>。 Map 没有 [] 访问器，这就是您收到错误的原因。

如果您想按索引获取结果，保留DataSnapshot 可能更容易：

final userS = snapshot.data!.snapshot;

然后通过索引访问其children：

children: [
  Text(userS.children.toList()[i].child('username').value),
  Text(userS.children.toList()[i].child('password').value)
],

所以这里我们使用userS.children.toList() 将子快照放入一个列表中，然后通过其索引查找正确的快照。然后我们可以从那里获取其username 和password 子属性的值。

【讨论】：

它返回了这个错误：构建时抛出了以下 NoSuchMethodError：类 '_InternalLinkedHashMap
如果您在我的回答中查看DataSnapshot 的链接，您会看到它有一个children 属性。听起来您仍然在userS 分配中获得.value，而不是像我在答案的第二个代码sn-p 中显示的那样将其设置为DataSnapshot。
首先我要感谢你坦率地说你以前帮助过我，它真的很有效，这一次你也是 100% 正确的，但这里我真正拥有的问题是在 ListView.builder ()，当我们从 userS 中删除 (value) 时，它会返回一个长度错误，因为 itemCount 采用 userS.length，这是错误：类 'DataSnapshot' 没有实例 getter 'length'。接收方：“DataSnapshot”实例尝试调用：长度
Frank 就像你上次给我小费时所做的那样，我一直在搜索和编码，直到找到与上一个一样的解决方案。 THAAAAAAAAAAAAAAAAAAANK你从我的心底
啊。有趣的。我应该使用length。在这种情况下，最好使用final userS = snapshot.data!.snapshot.children.toList() 并简化项目构建器中的代码。