Flutter cloud_firestore：如何将集合中的文档添加到DropdownButton中？

Question

Here's the code I have for my DropdownButton currently:

    new StreamBuilder<QuerySnapshot>(
        stream: Firestore.instance.collection("Teams").snapshots(),
        builder: (context, snapshot){
        var length = snapshot.data.documents.length;
        DocumentSnapshot ds = snapshot.data.documents[length];
        return new DropdownButton(
           items: <DropdownMenuItem>[
              new DropdownMenuItem(child: new Text(""))
           ],
        onChanged: _chooseTeam,
        hint: new Text("Join a Team"),
        value: team
       );
   }
),

I can't figure out how to dynamically add the collections to the List of DropDownButtonItems. HOw can I do this?

Answer 1

The items argument takes a List<DropdownMenuItem> , which also means that you could map your List<DocumentSnapshot> .

return DropdownButton(
       items: snapshot.data.documents.map((DocumentSnapshot document) {
          // I do not know what fields you want to access, thus I am fetching "field"
          return DropdownMenuItem(child: Text(document.documentID)}),           
)

Answer 2

I got it:

                      new StreamBuilder<QuerySnapshot>(
                        stream: Firestore.instance.collection("Teams").snapshots(),
                        builder: (context, snapshot){
                         var length = snapshot.data.documents.length;
                         DocumentSnapshot ds = snapshot.data.documents[length - 1];
                         return new DropdownButton(
                           items: snapshot.data.documents.map((DocumentSnapshot document) {
                             return DropdownMenuItem(child: new Text(document.documentID));
                           }).toList(),
                           onChanged: _chooseTeam,
                           hint: new Text("Join a Team"),
                           value: team
                         );
                        }
                      ),

I had to set the length to - 1, and get the document ID as the text. I also had to call toList() on the map

Answer 3

var category;    
StreamBuilder(
    stream: Firestore.instance.collection('category').snapshots(),
    builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
      if (!snapshot.hasData)
        Center(
          child: const CupertinoActivityIndicator(),
        );
      return DropdownButton<String>(
        value: category,
        isDense: true,
        hint: Text('Category'),
        onChanged: (newValue) {
          setState(() {
            category = newValue;
          });
        },
        items: snapshot.data != null
            ? snapshot.data.documents
                .map((DocumentSnapshot document) {
                return new DropdownMenuItem<String>(
                    value: document.data['name'].toString(),
                    child: new Container(
                      height: 100.0,
                      //color: primaryColor,
                      child: new Text(
                        document.data['name'].toString(),
                      ),
                    ));
              }).toList()
            : DropdownMenuItem(
                value: 'null',
                child: new Container(
                  height: 100.0,
                  child: new Text('null'),
                ),
              ),
      );
    }),

this example hopefully helps