使用API中的Json数据制作下拉菜单列表

我对颤振是新手，在这个项目中，我试图使用“get”方法将来自API的json数据放在我的下拉菜单列表中。 是的，我在中发现了一个已解决的问题，但解决方法与我使用的方法完全不同。我仍然发布这篇文章的原因是我想知道我在这段代码上犯了什么错误

这是我的main.dart代码：

import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:convert';
import 'package:http/http.dart' as http;


void main() => runApp(PrototypeApp());

class PrototypeApp extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return PrototypeAppState();
  }
}


class SSID {
  String name;
  String percentage;

  SSID({this.name, this.percentage});

  factory SSID.generateSSID(Map<String,dynamic>object){
    return SSID(
      name: object['SSID'].toString(),
      percentage:object['RSSI'].toString(),
       );
  }

  static Future<SSID> fetchAPI() async{
    String url='http://10.0.2.2/data/connection.json';
    var apiResult= await http.get(url,headers: {"Accept": "application/json"});
    var jsonObject=json.decode(apiResult.body);
    return SSID.generateSSID(jsonObject[0]);
  }

}

class PrototypeAppState extends State<PrototypeApp> {
  bool _obsstate=true;
  List<DropdownMenuItem<SSID>>_dropdownMenuItems;
  SSID _selectedSSID;
  List _ssids;

  @override
  void initState(){
    SSID.fetchAPI();                                              
    //isnt this meant that i had fetch Json data with this function, and put them on Class SSID?
    _ssids= List<SSID>();
    //then i put them to a new List variable on this class
    _dropdownMenuItems=buildDropdownMenuItems(_ssids);
    //should've been fine to do this isnt it?
    super.initState();
  }

  List<DropdownMenuItem<SSID>>buildDropdownMenuItems(List ssids){
   List<DropdownMenuItem<SSID>>items=List();
    for (SSID ssid in ssids) {
      items.add(
        DropdownMenuItem(
        value: ssid,
        child: Row(
          children:[
             Text(ssid.name),
             SizedBox(width: 20.0,),
             Text(ssid.percentage),
             Text('%'),
          ]
          )
        ),
      ); 
    }
    return items;
  }


  onChangeDropdownItem(SSID selectedsSSID){
    setState((){
      _selectedSSID=selectedsSSID;
    });
  }

  @override
  Widget build(BuildContext context){
      return MaterialApp(
        debugShowCheckedModeBanner: false,
        home:Scaffold(
          appBar: AppBar(
            title:Text('WIFI Configuration'),
          ),
          body: Container(
          child:Center(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children:[
                Text('pick your Wifi network'),
                SizedBox(height: 20.0,),
                DropdownButton(
                  value: _selectedSSID,
                  items: _dropdownMenuItems,
                  onChanged: onChangeDropdownItem,
                  ),
                SizedBox(height: 10.0,),
                Container(
                  width:300,
                  child:TextField(
                      obscureText:_obsstate,
                      decoration: InputDecoration(
                      hintText: 'type SSID password',
                    ),
                  ),
                ),
                Text('Selected network:${_selectedSSID.name}'),
                RaisedButton(
                  child: Text('Login'),
                  onPressed:null
                  ),
                ],
              ),
            ),
            ),
          )
      );
    }
}

调试控制台的（部分）说明如下：

I/flutter ( 9146): The following NoSuchMethodError was thrown building PrototypeApp(dirty, state:
I/flutter ( 9146): PrototypeAppState#b125a):
I/flutter ( 9146): The getter 'name' was called on null.
I/flutter ( 9146): Receiver: null
I/flutter ( 9146): Tried calling: name
I/flutter ( 9146):
I/flutter ( 9146): The following NoSuchMethodError was thrown building PrototypeApp(dirty, state:
I/flutter ( 9146): PrototypeAppState#b125a):
I/flutter ( 9146): The getter 'name' was called on null.
I/flutter ( 9146): Receiver: null
I/flutter ( 9146): Tried calling: name
I/flutter ( 9146):

很少有问题是显而易见的 1. <代码>SSID.fetchAPI（）返回future，因此它将异步工作，小部件将在获取数据之前构建。 2. <代码>SSID.fetchAPI（）尚未分配给任何变量 3.

\u ssids=List（）

因此，将Future小部件与
Future:SSID.fetchAPI（）一起使用

FutureBuilder(
future:SSID.fetchAPI（），
initialData:“正在加载文本…”，
生成器：（BuildContext上下文，异步快照ssid）{
返回新的SingleChildScrollView(
填充：新边缘设置。全部（8.0），
儿童：新文本(
ssid.name，
样式：新文本样式(
fontWeight:fontWeight.bold，
字体大小：19.0，
),
));
});

我也认为

static Future<SSID> fetchAPI() async{

static Future fetchAPI（）异步{

应该是

static Future<List<SSID>> fetchAPI() async{

static Future fetchAPI（）异步{

在这种情况下，建筑商将

FutureBuilder(
      future: SSID.fetchAPI(),
      initialData: "Loading text..",
      builder: (BuildContext context, AsyncSnapshot<List<SSID>> ssids) {
        return new SingleChildScrollView(
          padding: new EdgeInsets.all(8.0),
          child: new Text(
            ssids.length.toString(),
            style: new TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 19.0,
            ),
          ));
      });

FutureBuilder(
future:SSID.fetchAPI（），
initialData:“正在加载文本…”，
生成器：（构建上下文上下文，异步快照SSID）{
返回新的SingleChildScrollView(
填充：新边缘设置。全部（8.0），
儿童：新文本(
ssids.length.toString（），
样式：新文本样式(
fontWeight:fontWeight.bold，
字体大小：19.0，
),
));
});

根据您的需要定制生成器我只使用了一个文本小部件来检查数据是否正确接收

static Future<List<SSID>> fetchAPI() async{

FutureBuilder(
      future: SSID.fetchAPI(),
      initialData: "Loading text..",
      builder: (BuildContext context, AsyncSnapshot<List<SSID>> ssids) {
        return new SingleChildScrollView(
          padding: new EdgeInsets.all(8.0),
          child: new Text(
            ssids.length.toString(),
            style: new TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 19.0,
            ),
          ));
      });