user13456401
user13456401

Reputation: 479

Flutter retrieve data from firestore as a list

I have been struggling for hours now to retrieve data from firestore as a list so I can show them in a search bar suggestion.

This below function will retrieve data from firestore and return some selected fields as a list.

Future<List> getNewsOnSearchBar() async {
  final String _collection = 'news';
  final Firestore _fireStore = Firestore.instance;
  var newsList = [];

  print("1");

  Future<QuerySnapshot> getData() async {
    print("2");
    return await _fireStore.collection(_collection).getDocuments();
  }

  QuerySnapshot val = await getData();
  if (val.documents.length > 0) {
    print("3");
    for (int i = 0; i < val.documents.length; i++) {
      newsList.add(val.documents[i].data["headline"]);
    }
  } else {
    print("Not Found");
  }
  print("4");
  return newsList;
}

And below is my Search bar widget. It has an attribute searchList which is of type List<dynamic>. It accept values such as:

var list = ["a", "b", "c"];

searchList: list

So I want to call that above function getNewsOnSearchBar() and set the list to the attribute searchList. I tried below and it doesn't work.


Widget _showSearchBar(BuildContext context) {
  return FutureBuilder(
      future: getNewsOnSearchBar(),
      builder: (BuildContext context, AsyncSnapshot snapshot) {
        if (snapshot.hasError || !snapshot.hasData) {
          return _progressIndicator();
        } else {
          return GFSearchBar(

            searchList: [], //how can I assign the list return from `getNewsOnSearchBar()` here?
            searchQueryBuilder: (query, list) {
              return list
                  .where((item) =>
                      item.toLowerCase().contains(query.toLowerCase()))
                  .toList();
            },
            overlaySearchListItemBuilder: (item) {
              return Container(
                padding: const EdgeInsets.all(3),
                child: Text(
                  item,
                  style: const TextStyle(fontSize: 18),
                ),
              );
            },
            onItemSelected: (item) {},
          );
        }
      });
}

Could you help me, Please?

Upvotes: 0

Views: 474

Answers (2)

Shubham Gupta
Shubham Gupta

Reputation: 1997

Since your function getNewsOnSearchBar() is returning a list, you can use snapshot.data. so your function becomes something like this

return GFSearchBar(
        searchList: snapshot.data,
        searchQueryBuilder: (query, list) {
          return list
              .where((item) =>
                  item.toLowerCase().contains(query.toLowerCase()))
              .toList();
        },

Upvotes: 1

Tejero Lucas
Tejero Lucas

Reputation: 41

You can do it in two ways. 1-you can retrieve the documents for firebase and then you can use the Map function to create a list. 2-You can create a Firebase Functions to retrieve the information as you expect.

Upvotes: 0

Related Questions