Firebase doesn't work cause of null-safety (DART/FLUTTER)

Question

I'm using/learning Firebase for my database works. My snapshot's coming like _jsonQuerySnapshot or _jsonDocumentSnapshot. But it had to be QuerySnapshot or DocumentSnapshot. Because of this I have to encode and decode my snapshot for use my datas. If I'm not using encode decode json I'm getting null or object errors all the time. Here is my class extends from state


class _MyHomePageState extends State<MyHomePage> {
  final _firestore = FirebaseFirestore.instance;


  @override
  Widget build(BuildContext context) {
    CollectionReference moviesRef=_firestore.collection('movies');
    DocumentReference babaRef = _firestore.collection('movies').doc('Baba');



    return Scaffold(
      backgroundColor: Colors.grey,
      appBar: AppBar(
        title: Text('FireStore Crud'),
      ),
      body: Center(
        child: Container(
          child: Column(
            children: [
              StreamBuilder<QuerySnapshot>(
                stream: moviesRef.snapshots(),
                builder: (BuildContext context,AsyncSnapshot asyncSnapshot){
                  List<DocumentSnapshot>listOfDocumentSnapshot=asyncSnapshot.data.docs;
                  return Flexible(
                    child: ListView.builder(
                      itemCount: listOfDocumentSnapshot.length,
                      itemBuilder: (context,index){
                        Text('${listOfDocumentSnapshot[index].data()['name']}' ,style: TextStyle(fontSize: 24),);
                      },
                    ),
                  );



                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}

and this is my error .

First of all, check your data is it null or not and after that use [] on it. Probably, listOfDocumentSnapshot[index].data() is null. If it is null, render another ui such as loading. — Eray, Dec 22 '21 at 15:19
@Eray that seems to be a right answer. Can you post it as an actual answer? — Sergi, Dec 23 '21 at 14:08
Thank you to remind me @Sergi I am posting as an answer after a few improvement. — Eray, Dec 23 '21 at 15:05

Eray · Accepted Answer · 2022-01-29T15:36:51.587

First of all, check your data is null or not and then use [] on it. Probably, listOfDocumentSnapshot[index].data() is null. If it is null, render another UI such as loading screen. Namely, your loading screen must be showed until reach the data.

for example:

builder: (BuildContext context,AsyncSnapshot asyncSnapshot){
   List<DocumentSnapshot>? listOfDocumentSnapshot = asyncSnapshot.data.docs;

   if(!listOfDocumentSnapshot.hasData || listOfDocumentSnapshot == null){
      return LoadingScreen(); //etc.
   }

   return Flexible(
      child: ListView.builder(
         itemCount: listOfDocumentSnapshot.length,
         itemBuilder: (context,index){
            Text('${listOfDocumentSnapshot[index].data()['name']}' ,style: TextStyle(fontSize: 24),);
         },
      ),
   );
},

Futures (asynchronous programmes) need some time to get data and you have to make your UI wait until you get your data. e.g. database connections, read/write somethings to/from somewhere etc.

For more detail you can read this article.

Firebase doesn't work cause of null-safety (DART/FLUTTER)

1 Answers1