在 Dart/Flutter 中解析嵌套的 JSON

Posted

技术标签:

【中文标题】在 Dart/Flutter 中解析嵌套的 JSON【英文标题】:Parse nested JSON in Dart/Flutter 【发布时间】:2021-02-09 00:26:18 【问题描述】:

我正在尝试将我的 JSON 解析为 Data 类对象。我做了一些研究,确实找到了一些有用的文章,但仍然遇到错误。

我从后端得到的响应:

  "entrances": 
    "options": 
      "mainEntrance": 
        "text": "Enter through the main doors"
      ,
      "backEntrance": 
        "text": "Enter through the back doors"
      ,
      "sideEntrance": 
        "text": "Enter through the side doors"
      
    ,
    "footer": "Text goes here"
  ,
  "status": 
    "state": "open"
  

型号

class MyClass 
  String id;
  Options option;

  MyClass(this.id, this.option);

  MyClass.fromJson(Map<String, dynamic> json) 
    id = json['id'];
    option = json['option'];
  

  Map<String, dynamic> toJson() 
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['id'] = this.id;
    data['option'] = this.option;
    return data;
  


class Options 
  String name;
  String text;

  Options(this.name, this.text);

  Options.fromJson(Map<String, dynamic> json) 
    name = json['name'];
    text = json['text'];
  

  Map<String, dynamic> toJson() 
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['name'] = this.name;
    data['text'] = this.text;
    return data;
  

解码响应和映射

      setState(() 

        Map myMap = json.decode(response.body);
        List<MyClass> myClassList = new List<MyClass>();
        myMap['entrances'].forEach((key, value) 
          value['id'] = key;
          myClassList.add(MyClass.fromJson(value));
        );

        myClassList.forEach((MyClass) 
          print(MyClass.id);
          print(MyClass.option.name);
          print("--------------------\n");
        );
      );

我收到此错误:

Unhandled Exception: NoSuchMethodError: Class 'String' has no instance method '[]='.
Tried calling: []=("id", "footer")

我做错了什么?有更好的方法吗?

【问题讨论】:

【参考方案1】:

您可以使用此website 将您的 JSON 转换为 Dart 模型。我假设您的 JSON 以大括号开头。



    "entrances": 
        "options": 
            "mainEntrance": 
                "text": "Enter through the main doors"
            ,
            "backEntrance": 
                "text": "Enter through the back doors"
            ,
            "sideEntrance": 
                "text": "Enter through the side doors"
            
        ,
        "footer": "Text goes here"
    ,
    "status": 
        "state": "open"
    


那么你的模型应该是这样的:


class ResponseModel 
  Entrances entrances;
  Status status;

  ResponseModel(this.entrances, this.status);

  ResponseModel.fromJson(Map<String, dynamic> json) 
    entrances = json['entrances'] != null
        ? new Entrances.fromJson(json['entrances'])
        : null;
    status =
        json['status'] != null ? new Status.fromJson(json['status']) : null;
  

  Map<String, dynamic> toJson() 
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.entrances != null) 
      data['entrances'] = this.entrances.toJson();
    
    if (this.status != null) 
      data['status'] = this.status.toJson();
    
    return data;
  


class Entrances 
  Options options;
  String footer;

  Entrances(this.options, this.footer);

  Entrances.fromJson(Map<String, dynamic> json) 
    options =
        json['options'] != null ? new Options.fromJson(json['options']) : null;
    footer = json['footer'];
  

  Map<String, dynamic> toJson() 
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.options != null) 
      data['options'] = this.options.toJson();
    
    data['footer'] = this.footer;
    return data;
  


class Options 
  MainEntrance mainEntrance;
  MainEntrance backEntrance;
  MainEntrance sideEntrance;

  Options(this.mainEntrance, this.backEntrance, this.sideEntrance);

  Options.fromJson(Map<String, dynamic> json) 
    mainEntrance = json['mainEntrance'] != null
        ? new MainEntrance.fromJson(json['mainEntrance'])
        : null;
    backEntrance = json['backEntrance'] != null
        ? new MainEntrance.fromJson(json['backEntrance'])
        : null;
    sideEntrance = json['sideEntrance'] != null
        ? new MainEntrance.fromJson(json['sideEntrance'])
        : null;
  

  Map<String, dynamic> toJson() 
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.mainEntrance != null) 
      data['mainEntrance'] = this.mainEntrance.toJson();
    
    if (this.backEntrance != null) 
      data['backEntrance'] = this.backEntrance.toJson();
    
    if (this.sideEntrance != null) 
      data['sideEntrance'] = this.sideEntrance.toJson();
    
    return data;
  


class MainEntrance 
  String text;

  MainEntrance(this.text);

  MainEntrance.fromJson(Map<String, dynamic> json) 
    text = json['text'];
  

  Map<String, dynamic> toJson() 
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['text'] = this.text;
    return data;
  


class Status 
  String state;

  Status(this.state);

  Status.fromJson(Map<String, dynamic> json) 
    state = json['state'];
  

  Map<String, dynamic> toJson() 
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['state'] = this.state;
    return data;
  



【讨论】:

谢谢。能否举例说明如何使用 listview.builder 显示数据?

以上是关于在 Dart/Flutter 中解析嵌套的 JSON的主要内容,如果未能解决你的问题,请参考以下文章

Dart / Flutter 嵌套类静态访问

如何在Dart / flutter中映射和显示嵌套的JSON?

如何使用键路径从嵌套的字典dart中获取值。

如何使用键路径从嵌套的字典dart中获取值。

Dart / Flutter Json 解析问题

识别二维列表是不是包含 Dart/Flutter 中的列表