在 Flutter 中解析复杂 json 的问题

Question

我在转换以下响应时遇到问题 ->

{
"data": [
{
  "_id": "1AoJoWJ5Hdx3nZ5t",
  "title": "Orange is the new black",
  "imageUrl": "/1532353304050-oinb.jpg",
  "likesCount": 674
 },
{
  "_id": "AeqiQJewtTvMPc1B",
  "title": "X-Files",
  "imageUrl": "/1532353346638-xfiles.png",
  "likesCount": 6155
 },
{
  "_id": "gPkzfXoJXX5TuTuM",
  "title": "Star Trek: Voyager",
  "imageUrl": "/1532353336145-voyager.jpg",
  "likesCount": 23
 },
{
  "_id": "vQBQcYwtF9GWWJyK",
  "title": "South Park",
  "imageUrl": "/1532353313669-southpark.jpg",
  "likesCount": 56
 },
{
  "_id": "wjLUixBQ4sirMAYw",
  "title": "The Simpsons",
  "imageUrl": "/1532353326075-thesimpsons.jpg",
  "likesCount": 65
   }
 ]
}

我尝试使用 jsonserializer 插件以及 json_annotations 插件，但没有成功。我确实尝试用 quicktype.io 得到一个解析器 class 但它似乎根本不起作用。有人可以指导我或帮助我解决这个问题吗？谢谢！

Answer 1

Android Studio 中有一个很好的插件。
JSON 到飞镖 Class.
安装插件后，请执行以下操作。

按 ALT + L
输入 Class 名称并粘贴您的 JSON 回复
大功告成。

收到回复后，请按照以下步骤操作

import 'dart:convert';
var decodedData = json.decode(response.body);
var data = Data.fromJson(decodedData)

如果您需要回复的状态码，那么response.statusCode

Answer 2

我遵循了 Flutter 的官方文档，它对我有用。

https://flutter.dev/docs/development/data-and-backend/json

按照以下步骤解决您的问题。

如文档所示添加依赖项。

dependencies:
  # Your other regular dependencies here
  json_annotation: <latest_version>

dev_dependencies:
  # Your other dev_dependencies here
  build_runner: <latest_version>
  json_serializable: <latest_version>

创建Whosebug.dart

import 'package:json_annotation/json_annotation.dart';

part 'Whosebug.g.dart';

@JsonSerializable()
class WhosebugModel {
  @JsonKey(name: '_id')
  String id;
  String title;
  String imageUrl;
  int likesCount;

  WhosebugModel();
  
  factory WhosebugModel.fromJson(Map<String, dynamic> json) =>
      _$WhosebugModelFromJson(json);
  Map<String, dynamic> toJson() => _$WhosebugModelToJson(this);
}

将变量名称命名为 _id 会使 Dart 与私有变量混淆。最好使用 JsonKey 注释给它一个 JSON 名称。

运行 flutter pub run build_runner build 在终端中。
Whosebug.g.dart会这样生成

// GENERATED CODE - DO NOT MODIFY BY HAND

part of 'Whosebug.dart';

// **************************************************************************
// JsonSerializableGenerator
// **************************************************************************

WhosebugModel _$WhosebugModelFromJson(Map<String, dynamic> json) {
  return WhosebugModel()
    ..id = json['_id'] as String
    ..title = json['title'] as String
    ..imageUrl = json['imageUrl'] as String
    ..likesCount = json['likesCount'] as int;
}

Map<String, dynamic> _$WhosebugModelToJson(WhosebugModel instance) =>
    <String, dynamic>{
      '_id': instance.id,
      'title': instance.title,
      'imageUrl': instance.imageUrl,
      'likesCount': instance.likesCount
    };

要进行测试，请执行此操作

Map map = {
    "data": [
      {
        "_id": "1AoJoWJ5Hdx3nZ5t",
        "title": "Orange is the new black",
        "imageUrl": "/1532353304050-oinb.jpg",
        "likesCount": 674
      },
      {
        "_id": "AeqiQJewtTvMPc1B",
        "title": "X-Files",
        "imageUrl": "/1532353346638-xfiles.png",
        "likesCount": 6155
      },
      {
        "_id": "gPkzfXoJXX5TuTuM",
        "title": "Star Trek: Voyager",
        "imageUrl": "/1532353336145-voyager.jpg",
        "likesCount": 23
      },
      {
        "_id": "vQBQcYwtF9GWWJyK",
        "title": "South Park",
        "imageUrl": "/1532353313669-southpark.jpg",
        "likesCount": 56
      },
      {
        "_id": "wjLUixBQ4sirMAYw",
        "title": "The Simpsons",
        "imageUrl": "/1532353326075-thesimpsons.jpg",
        "likesCount": 65
      }
    ]
  };

  List<WhosebugModel> list = List.generate(map['data'].length,
      (index) => WhosebugModel.fromJson(map['data'][index]));

  print(list);

在 Flutter 中解析复杂 json 的问题

Problems parsing complex json in Flutter

arrays

json

response

dart

flutter