如何在 Flutter 中使用来自 Web 的数据设置 Dropdownbutton 的 Items？

Question

我正在使用 Flutter 制作应用程序。
我想要做的是使用来自网络的数据设置 DropboxList 的 Items 属性，我通过 Http.get.

获得

但是由于同步问题（我猜的），很难控制。

以下是我的代码，我在出现问题的地方做了注释。
有人知道吗？
谢谢。

============================================= =

通过 HTTP Get 从 Web 获取数据

 Future<List<DriveRecordForm>> getData() async {
    return await http.get(URL).then((response) {
      var jsonFeedback = convert.jsonDecode(response.body) as List;
      return jsonFeedback
          .map((json) => DriveRecordForm.fromJson(json))
          .toList();
    });
  }

主要代码

class _MyHomePageState extends State<MyHomePage> {
  final _scaffoldKey = GlobalKey<ScaffoldState>();

  List<String> _valueList = ['null'];
  String _SelectedCar = 'null';
  List<DriveRecordForm> Records = List<DriveRecordForm>();

  @override
  void initState() {
    FormController().getData().then((value) {
      setState(() {
        this.Records = value;      // !!! Get Data from Web and assign to Records.
      });
    });
    
    /* ↓ !!! Problem Here
         Use Records. 
         But this line is executed before 'this.Records = value' is executed. 
         Thus Records is empty.*/

    SpreadSheetUtil().FilterData(Records, "CarList");   

    _valueList[0] = Records[0];       // Set _valueList to set DropdownList's items attribute
    _valueList[1] = Records[1];       // Set _valueList to set DropdownList's items attribute
    _valueList[2] = Records[2];       // Set _valueList to set DropdownList's items attribute
    
    _SelectedCar = _valueList[0];     // Set __SelectedCar to set DropdownList's value attribute
  } 

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      resizeToAvoidBottomPadding: false,
      appBar: AppBar(
        title: Text(widget.title),
        centerTitle: true,
      ),
      body: ListView(
        children: <Widget>[
          Column(
            children: <Widget>[
              Row(
                children: <Widget>[
                  Expanded(
                    child: DropdownButton(
                      value: _SelectedCar,
                      items: _valueList.map((value) {     //  Assign _valueList but it's empty.
                        return DropdownMenuItem(
                          value: value,
                          child: Text(value),
                        );
                      }).toList(),
                      onChanged: (value) {
                        setState(() {
                          _SelectedCar = value;
                        });
                      },
                    ),
                  ),

Answer 1

您需要在 getData() 方法之后填写您的 valueList。它看起来像这样：

@override
  void initState() {
    FormController().getData().then((value) {
      setState(() {
        this.Records = value;      // !!! Get Data from Web and assign to Records.

    SpreadSheetUtil().FilterData(Records, "CarList");   

    _valueList[0] = Records[0];       // Set _valueList to set DropdownList's items attribute
    _valueList[1] = Records[1];       // Set _valueList to set DropdownList's items attribute
    _valueList[2] = Records[2];       // Set _valueList to set DropdownList's items attribute
    
    _SelectedCar = _valueList[0];     // Set __SelectedCar to set DropdownList's value attribute

      });
    });
    
  
  }

如何在 Flutter 中使用来自 Web 的数据设置 Dropdownbutton 的 Items？

How to set Dropdownbutton's Items with data from Web in Flutter?

flutter

http

dart

synchronization

dropdownbutton