嵌套json数据的序列化

Question

我正在努力学习颤振，但我在JSON序列化上被卡住了。我在YouTube和Flitter文档中学习了一些教程，但我在序列化方面遇到了一些困难。你能帮我一点忙吗，这是为了教育目的，所以我更感兴趣的是背后的理论，而不是解决方案本身，然而，即使只有解决方案，我认为我可以尝试理解这个过程。我应该提到，我知道这一点，但在我的例子中，数据中有嵌套对象，这让我感到困惑。

作为响应数据的样本，它基本上是一个商店，每天他们都有一个开张日期的列表，每个对象（天）都有开张时间和日期。

{
    "data": [
        {
            "openTime": {
                "open": "10:00",
                "close": "20:00"
            },
            "date": {
                "gregorian": {
                    "day": "01",
                    "weekday": {
                        "en": "Friday",
                        "de": "Freitag"
                    },
                    "month": {
                        "number": 5,
                        "en": "May",
                        "de": "Mai"
                    },
                    "year": "2020"
                }
            }
        },
        {
            "openTime": {
                "open": "12:00",
                "close": "18:00"
            },
            "date": {
                "gregorian": {
                    "day": "02",
                    "weekday": {
                        "en": "Saturday",
                        "de": "Samstag"
                    },
                    "month": {
                        "number": 5,
                        "en": "May",
                        "de": "Mai"
                    },
                    "year": "2020"
                }
            }
        }
    ]
}

获取数据的函数：

Future<Mall> fetchData() async {
  final response = await http.get(url);
  if (response.statusCode == 200) {
    return Mall.fromJson(json.decode(response.body));
  } else {
    throw Exception('Failed to load data!');
  }
}

我的班级购物中心有开放时间和日期，我想这是我的问题所在。

class Mall {
  final dynamic openTime;
  final dynamic date;

  Mall({this.openTime, this.date});

  factory Mall.fromJson(Map<String, dynamic> json) {
    return Mall(openTime: json['openTime'], date: json['date']);
  }
}

我尝试生成的结果应该是这样的，这样我就可以遍历数据列表并构建一张卡片，持续数天（例如，最后7天）

var time = [
  {
    "openTime": {"open": "10:00", "close": "20:00"},
    "date": "01 May 2020"
  },
  {
    "openTime": {"open": "12:00", "close": "18:00"},
    "date": "02 May 2020"
  },
];

我得到的错误是：

type 'List<dynamic>' is not a subtype of type 'Map<String, dynamic>'

如果你需要更多的细节，请告诉我。提前谢谢。

Answer 1

您的代码中有一些错误。

1-在这一部分中，您的响应是容器中名为“数据”的对象

Future<Mall> fetchData() async {
  final response = await http.get(url);
  if (response.statusCode == 200) {
    return Mall.fromJson(json.decode(response.body));  //here
  } else {
    throw Exception('Failed to load data!');
  }
}

2你的商城数据是嵌套对象中的数据，所以自定义你的商城类

class Mall {
    List<Datum> data;

    Mall({
        this.data,
    });

    factory Mall.fromJson(Map<String, dynamic> json) => Mall(
        data: List<Datum>.from(json["data"].map((x) => Datum.fromJson(x))),
    );

    Map<String, dynamic> toJson() => {
        "data": List<dynamic>.from(data.map((x) => x.toJson())),
    };
}

class Datum {
    OpenTime openTime;
    Date date;

    Datum({
        this.openTime,
        this.date,
    });

    factory Datum.fromJson(Map<String, dynamic> json) => Datum(
        openTime: OpenTime.fromJson(json["openTime"]),
        date: Date.fromJson(json["date"]),
    );

    Map<String, dynamic> toJson() => {
        "openTime": openTime.toJson(),
        "date": date.toJson(),
    };
}

class Date {
    Gregorian gregorian;

    Date({
        this.gregorian,
    });

    factory Date.fromJson(Map<String, dynamic> json) => Date(
        gregorian: Gregorian.fromJson(json["gregorian"]),
    );

    Map<String, dynamic> toJson() => {
        "gregorian": gregorian.toJson(),
    };
}

class Gregorian {
    String day;
    Weekday weekday;
    Month month;
    String year;

    Gregorian({
        this.day,
        this.weekday,
        this.month,
        this.year,
    });

    factory Gregorian.fromJson(Map<String, dynamic> json) => Gregorian(
        day: json["day"],
        weekday: Weekday.fromJson(json["weekday"]),
        month: Month.fromJson(json["month"]),
        year: json["year"],
    );

    Map<String, dynamic> toJson() => {
        "day": day,
        "weekday": weekday.toJson(),
        "month": month.toJson(),
        "year": year,
    };
}

class Month {
    int number;
    String en;
    String de;

    Month({
        this.number,
        this.en,
        this.de,
    });

    factory Month.fromJson(Map<String, dynamic> json) => Month(
        number: json["number"],
        en: json["en"],
        de: json["de"],
    );

    Map<String, dynamic> toJson() => {
        "number": number,
        "en": en,
        "de": de,
    };
}

class Weekday {
    String en;
    String de;

    Weekday({
        this.en,
        this.de,
    });

    factory Weekday.fromJson(Map<String, dynamic> json) => Weekday(
        en: json["en"],
        de: json["de"],
    );

    Map<String, dynamic> toJson() => {
        "en": en,
        "de": de,
    };
}

class OpenTime {
    String open;
    String close;

    OpenTime({
        this.open,
        this.close,
    });

    factory OpenTime.fromJson(Map<String, dynamic> json) => OpenTime(
        open: json["open"],
        close: json["close"],
    );

    Map<String, dynamic> toJson() => {
        "open": open,
        "close": close,
    };
}

现在，您可以像以前一样查看购物中心数据

Future<Mall> fetchData() async {
  final response = await http.get(url);
  if (response.statusCode == 200) {
    return Mall.fromJson(json.decode(response.body));  //here
  } else {
    throw Exception('Failed to load data!');
  }
}