在 listview 或 listbuilder 中显示 firebase 数据的 Flutter 代码答案

【问题标题】：Flutter code to display the firebase data in listview or in listbuilder在 listview 或 listbuilder 中显示 firebase 数据的 Flutter 代码
【发布时间】：2019-05-24 03:47:02
【问题描述】：

我正在开发一个应用程序，我需要在其中显示使用 list_view 存储在 Firebase 中的所有讲师详细信息。我为此使用了list_builder。我在所有列表视图中得到相同的数据，这意味着所有磁贴都包含相同的讲师 ID。

我尝试上传截图，但我无法上传它

输出： 1：变量存在：

{LEC02: {EMAIL: , SEX: MALE, ADDRESS: , MOBILE: , ID: LEC02, NAME: VIGNESH, POSITION: LECTURER, PASSWORD: LEC02, PHOTO: , QUALIFICATION: BCOM, DOJ: 2018-12-24 00:00:00.000}, LEC04: {EMAIL: , SEX: MALE, ADDRESS: , MOBILE: , ID: LEC04, NAME: KARTHIK, POSITION: LECTURER, PASSWORD: LEC04, PHOTO: , QUALIFICATION: MCOM, DOJ: 2018-12-26 00:00:00.000}}

2：变量key_id：

(LEC02, LEC04, LECTURER 01, LEC03, LEC01)

3：可变数据：

({EMAIL: , SEX: MALE, ADDRESS: , MOBILE: , ID: LEC02, NAME: VIGNESH, POSITION: LECTURER, PASSWORD: LEC02, PHOTO: , QUALIFICATION: BCOM, DOJ: 2018-12-24 00:00:00.000}, {EMAIL: , SEX: MALE, ADDRESS: , MOBILE: , ID: LEC04, NAME: KARTHIK, POSITION: LECTURER, PASSWORD: LEC04, PHOTO: , QUALIFICATION: MCOM, DOJ: 2018-12-26 00:00:00.000}, {EMAIL: , SEX: FEMALE, ADDRESS: , MOBILE: , ID: LECTURER 01, NAME: AA, POSITION: LECTURER, PASSWORD: LECTURER 01, PHOTO: , QUALIFICATION: KAAM, DOJ: 2018-12-25 00:00:00.000}, {EMAIL: , SEX: MALE, ADDRESS: , MOBILE: , ID: LEC03, NAME: PRANEETH, POSITION: HOD, PASSWORD: LEC03, PHOTO: , QUALIFICATION: MCA, DOJ: 2018-12-25 00:00:00.000}, {EMAIL: , SEX: MALE, ADDRESS: , MOBILE: , ID: LEC01, NAME: NISHA, POSITION: LECTURER, PASSWORD: LEC01, PHOTO: , QUALIFICATION: MCOM, DOJ: 2018-12-26 00:00:00.000})

代码

import 'package:flutter/material.dart';
import 'package:firebase_database/firebase_database.dart';
import 'dart:async';
import 'package:firebase_database/ui/firebase_animated_list.dart';

import '../slidelecturer.dart';
import 'dart:convert';

String lecturer_id,lecturer_name;
bool hasdata=true;
Map<dynamic,dynamic> exist;
Iterable<dynamic>key_id,data;
Widget body;


final FirebaseDatabase database = FirebaseDatabase.instance;

class viewlecturer extends StatefulWidget {
  @override
  _viewlecturerState createState() => _viewlecturerState();
}

class _viewlecturerState extends State<viewlecturer> {

 @override
 void initState(){
   print("hello");

  this.get_data();

 }

  @override
  Widget build(BuildContext context) {
    if(hasdata==false){
      body=new Container(

      child:Center(
        child: Text("LECTURER DOSE NOT EXIST",style: TextStyle(color: Colors.grey,fontWeight: FontWeight.bold,fontSize: 20),),

     ));
    }
     if(hasdata==true){
       body= new Container(
      child: ListView.builder(
         itemCount: exist==null?0:exist.length,
         itemBuilder: (BuildContext context,int index){
           return Card(
             child: new Text("${key_id}"),

           );
         },

       ),);}

    return body;

  }


   Future<String>get_data()async {

      database
          .reference()
          .child("NITTE/LECTURER").orderByValue()
          .once()
          .then((DataSnapshot snapshot) async {
            this.setState((){
              exist = snapshot.value;
            });

        if (exist == null) {
          setState(() {
            hasdata=false;      
                    });

            // confirmation();
        } else if (exist != null) {
          setState(() {
            hasdata=true; 

            key_id=exist.keys;
            data=exist.values;

          });
        }
      });
    }
  }

【问题讨论】：

标签： firebase firebase-realtime-database dart flutter

【解决方案1】：

您应该使用 StreamBuilder 并提供数据库中的快照作为流，并在构建器中返回您的列表视图。这允许您的列表视图不断刷新，因此您的用户将始终拥有更新的数据。

【讨论】：