首页 > 解决方案 > 主体上带有 Json 的 HTTP POST 方法 - Flutter/Dart

问题描述

带有 Json 的 HTTP POST 方法 - Flutter/Dart:

 Future<List<dynamic>> requestMethodtwo() async {
    var url = "";
    var body = json.encode({"finYr": "6", "UserID": "1"});
    setState(() {
      isLoading = true;
    });
    Map<String, String> headers = {
      'Content-type': 'application/json',
      'Accept': 'application/json',
    };
    final response =
    await http.post(url, body: body, headers: headers);
    final responseJson = json.decode(response.body);
    final items = json.decode(response.body).cast<Map<String, dynamic>>();
    List<dynamic> listOfString = items.map((json) {
      return json['rows'];
    }).toList();
    print(listOf[enter image description here][1]String);
    print(response.statusCode);
    if (response.statusCode == 200) {
    }
    else {
      throw Exception('Failed to load internet');
    }
    return listOfString;
  }
My Api Call 
[
    {
        "status": 200,
        "msg": "Ok",
        "rows": [
            {
                "lid": "11031",
                "CompanyName": "WALLS ICE CREAM",
                "LeadSourceName": "Website",
                "LeadSourceValue": "ONLINE ADS"
            },
            {
               "lid": "11032",
                "CompanyName": "WALLS ICE CREAM",
                "LeadSourceName": "Website",
                "LeadSourceValue": "ONLINE ADS"
            },
            {
                 "lid": "11034",
                "CompanyName": "WALLS ICE CREAM",
                "LeadSourceName": "Website",
                "LeadSourceValue": "ONLINE ADS"
            }
        ],
        "sql": "gg",
        "reserved": null
    }
]

标签: flutterdart

解决方案


第 1 步:例如为您的响应创建一个模型类

示例 JSON 结构 //在您的响应结果中是行

{
    "count": 49,
    "next": null,
    "previous": null,
    "results": [{
        "id": 4,
        "name": "PC",
        "image_background": "https://media.rawg.io/media/games/562/562553814dd54e001a541e4ee83a591c.jpg"
    }]

}


class PlatformResult
{
  int count;
  String next;
  final List<Results> result;
  PlatformResult({this.count,this.next,this.result});
  factory PlatformResult.fromJson(Map<String, dynamic> json) {
    return PlatformResult(
      count: json['count'],
      next:json['next'],
      result: parseResult(json),
    );

  }
  static List<Results> parseResult(resultJson) {
    var list = resultJson['results'] as List;
    List<Results> resultsList =
    list.map((data) => Results.fromJson(data)).toList();
    return resultsList;
  }

}

class Results {
  final int id;
  final String name;
  final String image_background;
  Results({this.id, this.name,this.image_background});
  factory Results.fromJson(Map<String, dynamic> parsedJson) {
    return Results(id: parsedJson['id'], name: parsedJson['name'],image_background:parsedJson['image_background']

    );

}

第2步:

获取结果的函数:

PlatformResult platformResult;
getData(BuildContext context) async {
  var res = await http
      .get(Uri.encodeFull(url), headers: {"Accept": "application/json"});
  print(res.body);
  if (res.statusCode == 200) {
    print(res.body);
    platformResult = PlatformResult.fromJson(json.decode(res.body));
  }
  return  platformResult;
}

第 3 步:

使用 FutureBuilder 显示您的列表数据

   FutureBuilder(
            future:   getData(context),
            builder: (BuildContext context,AsyncSnapshot  platformData)
              {
               if (platformData.hasData != null) {
                    return ListView.builder(
                      shrinkWrap: true,
                      itemCount: platformData==null?0:   platformResult.result.length,
                      itemBuilder: (context, index) {
                        return Card(
                          child: Container(
                            child: Column(children: <Widget>[
                               Text('${platformResult.result[index].name}'),
                              new Container(
                                  width: 190.0,
                                  height: 190.0,
                                  decoration: new BoxDecoration(
                                      shape: BoxShape.circle,
                                      image: new DecorationImage(
                                          fit: BoxFit.fill,
                                          image: new NetworkImage(

                                            platformResult.result[index].image_background,
                                          )
                                      )
                                  )),

                            ],),

                          ),

                        );
                      },
                    );
                  }
                  else {

                    return Center(child: CircularProgressIndicator(
                        valueColor: AlwaysStoppedAnimation<Color>(
                            Colors.green)));
                  }

              };)

推荐阅读