如何使用 Flutter 解析嵌套的 JSON?

Question

我想解析这个JSON数据，但我不知道如何解析它。

{
"kind": "Testing",
"data": {
"modhash": "fffffghhhhhhbf0bb4601d6158db548b5296632215a0",
"dist": 75,
"children": [
{
"kind": "z4",
"data": {
"subreddit": "iOS",
"selftext": "I am iOS developer",
"author_fullname": "tyy_iif5q",
"saved": false,
"gilded": 0,
"clicked": false,
"title": "When is a good time to use docker?",
"subreddit_name_prefixed": "r/webdev",
"hidden": false,
"pwls": 6,
"downs": 0,
"hide_score": false,
"name": "t3_gwqan4",
"quarantine": false,
"link_flair_text_color": "dark",
"upvote_ratio": 0.96,
"subreddit_type": "public",
"ups": 277,
"total_awards_received": 0,
"is_original_content": false,
"is_reddit_media_domain": false,
"is_meta": false,
"can_mod_post": false,
"score": 277,
"author_premium": false,
"thumbnail": "self",
"edited": false,
"is_self": true,
"created": 1591333752,
"link_flair_type": "text",
"wls": 6,
"author_flair_type": "text",
"domain": "self.webdev",
"allow_live_comments": false,
"selftext_html": "<!-- SC_OFF --><div class="md"><p>I just finished part 7 of the Full Stack Open course (<a href="https://www.fullstackopen.com/en">www.fullstackopen.com/en</a>) and due to graphQL and typescript not being within the core content of the course, I thought I might try and learn docker. </p>nn<p>Turns out, trying to learn docker is just making me even more confused than when I didn't even know docker existed. </p>nn<p>​</p>nn<p>Could someone explain to me, when is a good time to use docker? How one would go about using docker, and when in someone's learning path would one ideally learn docker?</p>nn<p>​</p>nn<p>I am still learning react, databases, and overall front-end and back-end web development currently. The most I have done thus-far is hosting an app I made on heroku. I haven't setup a personal website, portfolio, or hosted an app on an independent website either.</p>n</div><!-- SC_ON -->",
"archived": false,
"no_follow": false,
"is_crosspostable": true,
"pinned": false,
"over_18": false,
"media_only": false,
"can_gild": true,
"spoiler": false,
"locked": false,
"visited": false,
"subreddit_id": "t5_2qs0q",
"id": "gwqan4",
"is_robot_indexable": true,
"author": "Sensualities",
"num_comments": 127,
"send_replies": true,
"whitelist_status": "all_ads",
"contest_mode": false,
"author_patreon_flair": false,
"permalink": "/r/webdev/comments/gwqan4/when_is_a_good_time_to_use_docker/",
"parent_whitelist_status": "all_ads",
"stickied": false,
"url": "https://www.reddit.com/r/webdev/comments/gwqan4/when_is_a_good_time_to_use_docker/",
"subreddit_subscribers": 487697,
"created_utc": 1591304952,
"num_crossposts": 1,
"is_video": false
}
},
{
"kind": "t3",
"data": {
"subreddit": "iOS",
"selftext": "I am iOS developer",
"author_fullname": "tyy_iif5q",
"saved": false,
"gilded": 0,
"clicked": false,
"title": "When is a good time to use docker?",
"subreddit_name_prefixed": "r/webdev",
"hidden": false,
"pwls": 6,
"downs": 0,
"hide_score": false,
"name": "t3_gwqan4",
"quarantine": false,
"link_flair_text_color": "dark",
"upvote_ratio": 0.96,
"subreddit_type": "public",
"ups": 277,
"total_awards_received": 0,
"is_original_content": false,
"is_reddit_media_domain": false,
"is_meta": false,
"can_mod_post": false,
"score": 277,
"author_premium": false,
"thumbnail": "self",
"edited": false,
"is_self": true,
"created": 1591333752,
"link_flair_type": "text",
"wls": 6,
"author_flair_type": "text",
"domain": "self.webdev",
"allow_live_comments": false,
"selftext_html": "<!-- SC_OFF --><div class="md"><p>I just finished part 7 of the Full Stack Open course (<a href="https://www.fullstackopen.com/en">www.fullstackopen.com/en</a>) and due to graphQL and typescript not being within the core content of the course, I thought I might try and learn docker. </p>nn<p>Turns out, trying to learn docker is just making me even more confused than when I didn't even know docker existed. </p>nn<p>​</p>nn<p>Could someone explain to me, when is a good time to use docker? How one would go about using docker, and when in someone's learning path would one ideally learn docker?</p>nn<p>​</p>nn<p>I am still learning react, databases, and overall front-end and back-end web development currently. The most I have done thus-far is hosting an app I made on heroku. I haven't setup a personal website, portfolio, or hosted an app on an independent website either.</p>n</div><!-- SC_ON -->",
"archived": false,
"no_follow": false,
"is_crosspostable": true,
"pinned": false,
"over_18": false,
"media_only": false,
"can_gild": true,
"spoiler": false,
"locked": false,
"visited": false,
"subreddit_id": "t5_2qs0q",
"id": "gwqan4",
"is_robot_indexable": true,
"author": "Sensualities",
"num_comments": 127,
"send_replies": true,
"whitelist_status": "all_ads",
"contest_mode": false,
"author_patreon_flair": false,
"permalink": "/r/webdev/comments/gwqan4/when_is_a_good_time_to_use_docker/",
"parent_whitelist_status": "all_ads",
"stickied": false,
"url": "https://www.reddit.com/r/webdev/comments/gwqan4/when_is_a_good_time_to_use_docker/",
"subreddit_subscribers": 487697,
"created_utc": 1591304952,
"num_crossposts": 1,
"is_video": false
}
}
],
"after": "ggggggg"
}
}

我想解析此 JSON 数据，但我不知道如何解析它。我使用简单的 json，但我不知道如何解析嵌套的 json，请帮助我。我想解析此 JSON 数据，但我不知道如何解析它。我使用简单的 json，但我不知道如何解析嵌套的 json，请帮助我。

Answer 1

看看这个库，它将帮助您;)

https://pub.dev/packages/json_serializable

此库将为每个模型生成 Json 和 toJson 的转换代码，并带有@JsonSerializable

它负责嵌套对象，类型转换和许多其他事情;)

Answer 2

使用此链接准备 Json 的模型类 https://javiercbk.github.io/json_to_dart/

HttpResponse Response = callApi;

然后在得到响应后，只需使用 json.decode;

然后使用通过链接生成的模型的fromjson方法，并解析整个json。

Map userMap = jsonDecode(jsonString);
var user = User.fromJson(userMap);

用户是从站点创建的模型

Answer 3

首先，您需要一个表示 JSON 的类，该方法使用fromJson将 JSON 解析到您的对象中。

此外，还应将嵌套类用于嵌套的 JSON 字段

或者，您可以使用此类生成器生成必要的类

class JSONRepresentation {
final String kind;
final Data data;
JSONRepresentation({this.kind, this.data});
JSONRepresentation .fromJson(Map<String, dynamic> data)
: kind = data['kind'],
data = Data .fromJson(data['data']);
}

class Data {
final String modhash;
final int dist;
//final List<AnotherDataClass> children;
final String after;
Data({this.modhash, this.dist, this.after});
Data .fromJson(Map<String, dynamic> data)
: modhash = data['modhash'],
dist = data['dist'],
after = data['after'];
}

然后您可以使用dart:convert解析它，并从表示 JSON 的对象中获取数据，如下所示

import "dart:convert";
void main() {
var jsonData = 
'{"kind": "Testing",
"data": { 
"modhash": "fffffghhhhhhbf0bb4601d6158db548b5296632215a0",
"dist": 75, 
//"children": [...],
"after": "ggggggg"}}';
var parsedJson = json.decode(jsonData);
var jsonRepresentationObject = JSONRepresentation.fromJson(parsedJson);
//Example of getting data from objects  representing JSON
print("kind: "+ jsonRepresentationObject.kind +
"nData modhash: " + jsonRepresentationObject.data.modhash);
}

你可以在这里测试我的例子 - 在线飞镖编译器