Himanshu Suthar
Himanshu Suthar

Reputation: 487

What is the method to show data from a list on screen in flutter?

I stored some data from firestore instance in a list and now I want to display the data on my screen.

When I print my list in terminal, I see this:

I/flutter (11351): [{num: 100, title: This is test 2}]

I defined a list like this:

var list = new List();

I am fetching data on a click of button.

RaisedButton(
                onPressed: () async {
                  var documentReference = await Firestore.instance.collection('insults').document('vv4YjpyRFFEknbCyC9o7');
                  documentReference.get().then((documentSnapshot){
                    setState(() {
                      list.add(documentSnapshot.data);
                    });
                    print(list);

                  }) ;
                },
                child: Text('Press me'),
              ),

Please guide me a little. I just started learning flutter.

I do not want to loop through document but I want to store it in a list using a suitable method.

Upvotes: 0

Views: 428

Answers (1)

Peter Haddad
Peter Haddad

Reputation: 80934

There is no need to show a list, since you are only retrieving data under one document, if you want to show the retrieved data, then you can do the following:

First create an instance variable under your State:

Map<String, dynamic> retrievedData = Map<String, dynamic>();

Then inside setState assign the data to retrievedData:

RaisedButton(
                onPressed: () async {
                  var documentReference = await Firestore.instance.collection('insults').document('vv4YjpyRFFEknbCyC9o7');
                  documentReference.get().then((documentSnapshot){
                    setState(() {
                      retrieveData = documentSnapshot.data;
                    });
                  }) ;
                },
                child: Text('Press me'),
              ),

Inside the build method you can have a Column with multiple children for example:

          children: <Widget>[
            Text(
               retrievedData["title"] ?? "",
            ),
             Text(
              retrievedData["num"] ?? "",
            ), 
          ],

When clicking the button, setState will call the build method and you will have your data on the screen.

Upvotes: 1

Related Questions