Flutter中创建表格数组对象模型时JSON转Dart遇语法错误求助

一、修复JSON语法错误 #

你提供的JSON存在两处语法问题：

• anObj内部最后一个字段"d8": "",后多了逗号
• anObj对象末尾多了逗号，且整个JSON未闭合大括号

修复后的合法JSON如下：

{
  "serialNumber": "",
  "anObj": {
    "a1": "",
    "a2": "",
    "a3": "",
    "a4": "",
    "a5": "",
    "a6": "",
    "a7": "",
    "a8": "",
    "b1": "",
    "b2": "",
    "b3": "",
    "b4": "",
    "b5": "",
    "b6": "",
    "b7": "",
    "b8": "",
    "c1": "",
    "c2": "",
    "c3": "",
    "c4": "",
    "c5": "",
    "c6": "",
    "c7": "",
    "c8": "",
    "d1": "",
    "d2": "",
    "d3": "",
    "d4": "",
    "d5": "",
    "d6": "",
    "d7": "",
    "d8": ""
  }
}

二、优化数据结构适配表格设计 #

从字段命名（a1-a8、b1-b8等）和表格逻辑来看，原平铺结构不利于表格渲染，建议改成分组数组结构，更贴合表格的行/列展示需求：

{
  "serialNumber": "",
  "groups": [
    {
      "groupName": "A",
      "items": ["", "", "", "", "", "", "", ""]
    },
    {
      "groupName": "B",
      "items": ["", "", "", "", "", "", "", ""]
    },
    {
      "groupName": "C",
      "items": ["", "", "", "", "", "", "", ""]
    },
    {
      "groupName": "D",
      "items": ["", "", "", "", "", "", "", ""]
    }
  ]
}

如果每个表格项需要单独标注名称（对应表格列名），可进一步调整为对象数组结构：

{
  "serialNumber": "",
  "groups": [
    {
      "groupName": "A",
      "items": [
        {"label": "a1", "value": ""},
        {"label": "a2", "value": ""},
        {"label": "a3", "value": ""},
        {"label": "a4", "value": ""},
        {"label": "a5", "value": ""},
        {"label": "a6", "value": ""},
        {"label": "a7", "value": ""},
        {"label": "a8", "value": ""}
      ]
    },
    // B、C、D组结构与A组一致
  ]
}

三、生成对应Dart模型 #

以优化后的分组数组结构为例，生成的Dart模型代码如下：

class TableModel {
  String? serialNumber;
  List<Group>? groups;

  TableModel({this.serialNumber, this.groups});

  TableModel.fromJson(Map<String, dynamic> json) {
    serialNumber = json['serialNumber'];
    if (json['groups'] != null) {
      groups = <Group>[];
      json['groups'].forEach((v) {
        groups!.add(Group.fromJson(v));
      });
    }
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = <String, dynamic>{};
    data['serialNumber'] = serialNumber;
    if (groups != null) {
      data['groups'] = groups!.map((v) => v.toJson()).toList();
    }
    return data;
  }
}

class Group {
  String? groupName;
  List<String>? items;

  Group({this.groupName, this.items});

  Group.fromJson(Map<String, dynamic> json) {
    groupName = json['groupName'];
    items = json['items'].cast<String>();
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = <String, dynamic>{};
    data['groupName'] = groupName;
    data['items'] = items;
    return data;
  }
}

内容的提问来源于stack exchange，提问作者Fash