Firebase 和 Flutter 是否支持在 Web 上一次性读取？

Question

我正在使用 Firebase 和 Flutter 来读取对象列表 (EspecieModel)。它在 IOS 和 Android 上运行完美，但在 Web 上无法运行（检索到空列表）。

我正在阅读 Firebase 如下...

Future<List<EspecieModel>> cargarTipoEspecie() async {

  final List<EspecieModel> tipoEspecie = []; 

  Query resp = db.child('PATH/tipoespecie');
  resp.onChildAdded.forEach((element) {
        final temp = EspecieModel.fromJson(Map<String,dynamic>.from(element.snapshot.value));
        temp.idEspecie = element.snapshot.key;
        tipoEspecie.add(temp);   
  });
  await resp.once().then((snapshot) {
    print("Loaded - ${tipoEspecie.length}");
  });
      return tipoEspecie;

}

我正在使用 Future Builder 来显示信息...

FutureBuilder(
        future: _tipoEspecieBloc.cargarTipoEspecie(), 
        builder: (BuildContext context, AsyncSnapshot snapshot) {
            // print(snapshot.connectionState);
            if (snapshot.connectionState == ConnectionState.done && snapshot.hasData{
              // print(snapshot.data);
              final _especies = snapshot.data;
                   return Stack(
                    children: <Widget>[
                      ListView.builder(
                        itemCount: _especies!.length,
                        itemBuilder: (context, i) { 
                          return _crearItem(context, _especies[i], i);
                        },
                      ),
                    ],
                  );   
            } else if (snapshot.hasError) {
              print(snapshot.error);
              return Text(snapshot.error.toString());
            }
            else {
              return //CircleProgressIndicator Code
            );
            }
        },
      ),

我无法确定自己做错了什么

如何做一个在 IOS、Android 和 Web 上都运行良好的一次性 Firebase 查询？？

Answer 1

这行不通：

resp.onChildAdded.forEach((element) {
     final temp = EspecieModel.fromJson(Map<String,dynamic>.from(element.snapshot.value));
     temp.idEspecie = element.snapshot.key;
     tipoEspecie.add(temp);   
});
await resp.once().then((snapshot) {
 print("Loaded - ${tipoEspecie.length}");
});
return tipoEspecie;

onChildAdded 不是await 的一部分，所以我怀疑一切都按照你想要的方式等待。只需在一处添加await，不会使其余代码同步。

请考虑只使用once()，然后通过循环snapshot.value.values（一个相对较新的addition to the API）来填充您的tipoEspecie数组。

var snapshot = await resp.once();
snapshot.value.values.forEach((node) {
  final temp = EspecieModel.fromJson(Map<String,dynamic>.from(node.value));
  temp.idEspecie = node.key;
  tipoEspecie.add(temp);   
});
return tipoEspecie;

注意：我不完全确定 .forEach 和其中的代码。因此，如果您在那里遇到错误，请检查您从 .values 返回的类型以及 node 是什么，以从中获取正确的键和值。