0

I'm trying to get my data in firestore wherein that data is array and output that data in a card. As of now the output I'm getting is "null". What is the best way to get this array of data? I'm using StreamBuilder<QuerySnapshot> to get the data.

Here is my code:

StreamBuilder<QuerySnapshot>(
                stream: db.collection('ACTIVITIES').snapshots(),
                builder: (context, snapshot) {
                  if (snapshot.hasData) {
                    return Column(
                        children: snapshot.data.documents
                            .map((doc) => buildItem(doc))
                            .toList());
                  } else {
                    return SizedBox();
                  }
                })

Here is where I try to output the data:

Card buildItem(DocumentSnapshot doc) {
return Card(
  elevation: 5,
  child: Padding(
    padding: const EdgeInsets.all(8),
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Text(
          'Name: ${doc.data['Name_ofUser']}',
          style: TextStyle(fontSize: 20),
        ),
        Text(
          'Description: ${doc.data['Help_Description']}',
          style: TextStyle(fontSize: 20),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            FlatButton(
              color: Color(0xFF121A21),
              shape: new RoundedRectangleBorder(
                borderRadius: new BorderRadius.circular(30.0),
              ),
              onPressed: () {},
              child: Text(
                'Respond',
                style: TextStyle(color: Colors.white, fontSize: 12),
              ),
            ),
            SizedBox(
              width: 5,
            ),
            FlatButton(
              color: Color(0xFF121A21),
              shape: new RoundedRectangleBorder(
                borderRadius: new BorderRadius.circular(30.0),
              ),
              onPressed: () {},
              child: Text(
                'Read',
                style: TextStyle(color: Colors.white, fontSize: 12),
              ),
            )
          ],
        ),
      ],
    ),
  ),
);
}

This is my database structure:

My db link

1 Answer 1

2

Your ACTIVITIES collection, could have any number of documents, where each document could have any number of Issue.

In your case you only have 1 document and it has an array of Issue.

So, if you want to display all the Issue of the first document, you could do something like this:

return Column(
    children: snapshot.data.documents.first['Issue']
       .map<Widget>((issue) => buildItem(issue))
       .toList());

Then buildItem() would receive a Map<String, dynamic>, like this:

Card buildItem(Map issue) {

So now you could access to the map, like this:

issue['Help_Description']

If you want to show all issues from all documents, one below the other, in one single column, you could do something like this:

final issuesLists = snapshot.data.documents
    .map((doc) =>
        doc['Issue'].map<Widget>((issue) => buildItem(issue)).toList())
    .toList();
return Column(children: issuesLists.expand<Widget>((issues) => issues).toList());
Sign up to request clarification or add additional context in comments.

17 Comments

It still outputs a null value sir @Pablo :(
I updated my answer. I couldn't test it but I think you could get the idea to make it work.
I tried it sir @Pablo but it showed me this, The method 'map' was called on null. Receiver: null Tried calling: map(Closure: (dynamic) => Card). and supposedly I need to get lots of documents that has an array of "Issue" not only 1 sir. Please help. I really need to fix this. Stuck here for how many days already :(
Sorry, is first['Issue'] not first['Issues'], check if changing that works.
Oh silly me, I got the spelling wrong here children snapshot.data.documents.first['Issue']. but now this appeared :( type 'List<dynamic>' is not a subtype of type 'List<Widget>'
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.