只需检查我制作的以下示例：
以下是你提供的json文件，我在本地解析过。
{
"responses": [{
"Contents": {
"Images": [{
"url": "https:URL"
},
{
"url": "https:URL"
}
],
"Ages": [{
"age": "33"
},
{
"age": "34"
}
],
"Labels": [{
"age": "33"
}
]
}
}]
}
为 json 文件创建的模型类：
// To parse this JSON data, do
//
// final response = responseFromJson(jsonString);
import 'dart:convert';
Response responseFromJson(String str) => Response.fromJson(json.decode(str));
String responseToJson(Response data) => json.encode(data.toJson());
class Response {
List<ResponseElement> responses;
Response({
this.responses,
});
factory Response.fromJson(Map<String, dynamic> json) => Response(
responses: List<ResponseElement>.from(json["responses"].map((x) => ResponseElement.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"responses": List<dynamic>.from(responses.map((x) => x.toJson())),
};
}
class ResponseElement {
Contents contents;
ResponseElement({
this.contents,
});
factory ResponseElement.fromJson(Map<String, dynamic> json) => ResponseElement(
contents: Contents.fromJson(json["Contents"]),
);
Map<String, dynamic> toJson() => {
"Contents": contents.toJson(),
};
}
class Contents {
List<Image1> images;
List<Age> ages;
List<Age> labels;
Contents({
this.images,
this.ages,
this.labels,
});
factory Contents.fromJson(Map<String, dynamic> json) => Contents(
images: List<Image1>.from(json["Images"].map((x) => Image1.fromJson(x))),
ages: List<Age>.from(json["Ages"].map((x) => Age.fromJson(x))),
labels: List<Age>.from(json["Labels"].map((x) => Age.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"Images": List<dynamic>.from(images.map((x) => x.toJson())),
"Ages": List<dynamic>.from(ages.map((x) => x.toJson())),
"Labels": List<dynamic>.from(labels.map((x) => x.toJson())),
};
}
class Age {
String age;
Age({
this.age,
});
factory Age.fromJson(Map<String, dynamic> json) => Age(
age: json["age"],
);
Map<String, dynamic> toJson() => {
"age": age,
};
}
class Image1 {
String url;
Image1({
this.url,
});
factory Image1.fromJson(Map<String, dynamic> json) => Image1(
url: json["url"],
);
Map<String, dynamic> toJson() => {
"url": url,
};
}
这是您获取和显示数据的主要 UI 文件，我已在列表视图中显示您的数据。
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:sample_project_for_api/model.dart';
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
bool isLoading = false;
List<Age> ages = List();
List<Age> labels = List();
List<Image1> image = List();
// here i have taken the json locally which you posted on stack
Future<String> loadFromAssets() async {
return await rootBundle.loadString('json/parse.json');
}
@override
void initState() {
super.initState();
givenFunction();
}
Future givenFunction() async {
setState(() {
isLoading = true;
});
//http.Response response = await http.post(url, body: json.encode(data));
// you can make the http call above just uncomment is and comment the below line
String jsonString = await loadFromAssets();
// Here you can just replace down your response.body with jsonString
final response = responseFromJson(jsonString);
print(response.responses[0].contents.ages[0].age);
//ages =response.responses[0].contents.
for (int i = 0; i < response.responses[0].contents.ages.length; i++) {
ages.add(response.responses[0].contents.ages[i]);
}
for (int i = 0; i < response.responses[0].contents.images.length; i++) {
image.add(response.responses[0].contents.images[i]);
}
for (int i = 0; i < response.responses[0].contents.labels.length; i++) {
labels.add(response.responses[0].contents.labels[i]);
}
setState(() {
isLoading = false;
});
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: isLoading
? CircularProgressIndicator()
: SafeArea(
child: Container(
child: Column(
children: <Widget>[
Container(
width: 400,
height: 100,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: ages.length,
itemBuilder: (BuildContext context, int index) {
return Container(
width: 100,
height: 100,
child: Card(
elevation: 10,
child: Center(child: Text(ages[index].age)),
),
);
},
),
),
Container(
width: 500,
height: 200,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: image.length,
itemBuilder: (BuildContext context, int index) {
return Container(
width: 100,
height: 100,
child: Card(
elevation: 10,
child: Center(child: Text(image[index].url)),
),
);
},
),
),
Container(
width: 500,
height: 200,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: labels.length,
itemBuilder: (BuildContext context, int index) {
return Container(
width: 100,
height: 100,
child: Card(
elevation: 10,
child: Center(child: Text(labels[index].age)),
),
);
},
),
)
],
),
),
)),
);
}
}
void main() {
runApp(HomePage());
}
刚刚截屏：
请检查并告诉我。