如何在颤振中使用实时数据库中的 StreamBuilder 在列表视图中显示数据

时间:2021-05-03 10:33:31

标签: firebase flutter dart firebase-realtime-database

我正在为我的大学项目开发​​应用程序,但遇到了错误。我正在使用实时数据库来存储数据。我正在使用 listView 显示数据库中的所有可用数据。My DB looks like this 每当我尝试从数据库检索数据时,如果数据可用,就会加载它。但是,如果没有可用数据(我的意思是如果 PlantData 不可用)那么它会显示此错误

这是我的代码

final dbRef = FirebaseDatabase.instance
      .reference()
      .child("IDh04V383uYGQQfWlVWp2XsdR0J3")
      .child("PlantData");

  List lists = List();


@override
  Widget build(BuildContext context) {
    return Scaffold(
      
      body: Container(
        child: StreamBuilder(
          stream: dbRef.onValue,
          builder: (context, AsyncSnapshot<Event> snapshot) {
            if (snapshot.hasData) {
              print("Error on the way");
              lists.clear();
              DataSnapshot dataValues = snapshot.data.snapshot;
              Map<dynamic, dynamic> values = dataValues.value;
              values.forEach((key, values) {
                lists.add(values);
              });
              return new ListView.builder(
                shrinkWrap: true,
                itemCount: lists.length,
                itemBuilder: (BuildContext context, int index) {
                  return Card(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Text("Name: " + lists[index]["smartID"]),
                        Text("Image: " + lists[index]["plantname"]),
                      ],
                    ),
                  );
                },
              );
            }
            return Container(child: Text("Add Plants"));
          },
        ),
      ),
      
    );

1 个答案:

答案 0 :(得分:1)

正如@Uni 提到的,您可以向您的 StreamBuilder 提供 initialData,但我也建议您始终编写您的代码,以便为状态可能出现的每种情况做好准备:

final dbRef = FirebaseDatabase.instance
      .reference()
      .child("IDh04V383uYGQQfWlVWp2XsdR0J3")
      .child("PlantData");

  List lists = List();


@override
  Widget build(BuildContext context) {
    return Scaffold(
      
      body: Container(
        child: StreamBuilder(
          stream: dbRef.onValue,
          builder: (context, AsyncSnapshot<Event> snapshot) {
            if (snapshot.hasData && !event.hasError &&
            event.data.snapshot.value != null) {
              print("Error on the way");
              lists.clear();
              DataSnapshot dataValues = snapshot.data.snapshot;
              Map<dynamic, dynamic> values = dataValues.value;
              values.forEach((key, values) {
                lists.add(values);
              });
              return new ListView.builder(
                shrinkWrap: true,
                itemCount: lists.length,
                itemBuilder: (BuildContext context, int index) {
                  return Card(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Text("Name: " + lists[index]["smartID"]),
                        Text("Image: " + lists[index]["plantname"]),
                      ],
                    ),
                  );
                },
              );
            }
            return Container(child: Text("Add Plants"));
          },
        ),
      ),
      
    );

您还应该在数据加载和出现错误时处理状态。这样你就不会得到任何惊喜。