Flutter app with loading while retrieving API

问题

I'm using an API which returns the value like this.

[
    {
        "store": "AMAZON"
    },
    {
        "store": "FLIPKART"
    },
    {
        "store": "WALMART"
    },
    {
        "store": "ALIBABA"
    },

]

I need this to be in a drop down. I need a drop down button with this API data in it. Some one help please. I have tried many ways but nothing worked.

回答1:

nigale try code:

List<String> markets = []; // Or  var markets = [];

  String _mySelection;
  @override
  void initState() {
    buidDropDownItems();
    super.initState();
  }

// 
void buidDropDownItems() async {
    markets = await retrievedata.getMarket();
    // Refresh the UI if the State object has been created
    if(mounted){
      setState(() {});
    }
}

 child: DropdownButton(
          items: markets.map<DropdownMenuItem<String>>((String val){
                  return DropdownMenuItem<String>(value: val, child: Text(val));
                }).toList(), // Get items from the available data in markets variable
          onChanged: (sto) {
            setState(() {
              _mySelection = sto;
            });
          },
          value: _mySelection,
          hint: Text('Please select the store: '),
        ),

The function retrievedata.getMarket(); is returning Future<dynamic> which dynamic is your markets list.

回答2:

let's say that this array is retrieved in a variable called data

 List<String>list=[];
for(var itemData in data){
  list.add(itemData['store']);
}

And wala, Now list conation array of String ready to be used

来源：https://stackoverflow.com/questions/64893314/flutter-app-with-loading-while-retrieving-api