Flutter drop down causes error in Future while using it with API

问题

I'm very new to flutter. I'm using an API to which sends the data as an JSON. The format of the JSON is here.

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

]

I need to use this store values in a drop down button. There are three files dataRetrieve.dart, homePage.dart, main.dart. main.dart Points to homePage.dart

homePage.dart's init state call dataRetrieve.dart to make a post request to get the data. The code of homePage.dart is here.

var markets;
  String _mySelection;
  @override
  void initState() {
    super.initState();
    setState(() {
      markets = retrievedata.getMarket();
    });
  }

In homePage.dart I have dropdown button and the code is here.

child: DropdownButton(
                  items: stores,
                  onChanged: (sto) {
                    setState(() {
                      _mySelection = sto;
                    });
                  },
                  value: _mySelection,
                  hint: Text('Please select the store: '),
                ),

The data.Retrieve.dart code is here.

import 'dart:convert';

import 'package:http/http.dart';

class retrieveData {
  getMarket() async {
    String url;
    Response response = await post(url);
    var resp = json.decode(response.body);
    List stores = List();
    for (int i = 0; i < json.decode(response.body).length; i++) {
      stores.add(resp[i]['store']);
    }
    return stores;
  }
}

final retrieveData retrievedata = retrieveData();

The main.dart file is here.

import 'package:agrimarket/homePage.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter App',
      debugShowCheckedModeBanner: false,
      home: homePage(),
    );
  }
}

While this code produces some error. The error is here

═╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
The following _TypeError was thrown building homePage(dirty, state: homePageState#8914c):
type 'Future<dynamic>' is not a subtype of type 'List<DropdownMenuItem<String>>'
The relevant error-causing widget was:
homePage
lib\main.dart:14
When the exception was thrown, this was the stack:

I have declared and assigned the URL.

How to use the retrieved value in dropdown.

回答1:

The solution would be to make the DrowpDownButton's parent widget a, ListView.builder.Then, make the itemCount:markets.length and finally use this format to parse in the items for the dropdownmenuitems

 items: <[Stores]
          .map<DropdownMenuItem<String>>((String value) {
        return DropdownMenuItem<String>(
          value: value,
          child: Text(value),
        );
      }).toList(),

回答2:

To complete the Ferdinand's answer you to make sure that stores is not remaining null before API do not complete to load data.

To avoid null exception initialize stores = []; or check this answer https://stackoverflow.com/a/64894117/10663537

来源：https://stackoverflow.com/questions/64888506/flutter-drop-down-causes-error-in-future-while-using-it-with-api

标签

Flutter

dart

dropdown