【发布时间】:2021-03-21 15:57:53
【问题描述】:
试图获取植物信息并找到https://trefle.io/ Api,要在我的flutter应用程序中使用,我需要植物信息列表,所以我找到了这样的json结构;
我正在尝试从 api 数组中获取数据并在我的 ListView.builder 中实现它,但出现错误;
类型“Future”不是类型“Map
那么从json中获取数组数据最有效的方法是什么
列表视图
ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: 10,
itemBuilder: (BuildContext context, int index) {
Plant plant = Plant.fromJson(decodedData);
Data data = plant.data[index];
Container(
child: Image(
image: NetworkImage(data.imageUrl),
),
);
}),
获取数据
Future<dynamic> fetchData(String url, bool asyncCall) async {
asyncCall = true;
response = await http.get(url);
decoded = json.encode(response.body);
return decoded;
}
植物
class Plant {
List<Data> data;
Plant({this.data});
Plant.fromJson(Map<String, dynamic> json) {
if (json['data'] != null) {
data = new List<Data>();
json['data'].forEach((v) {
data.add(new Data.fromJson(v));
});
}
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
if (this.data != null) {
data['data'] = this.data.map((v) => v.toJson()).toList();
}
return data;
}
}
数据
class Data {
int id;
String commonName;
String slug;
String scientificName;
int year;
String bibliography;
String author;
String status;
String rank;
String familyCommonName;
int genusId;
String imageUrl;
List<String> synonyms;
String genus;
String family;
Data({
this.id,
this.commonName,
this.slug,
this.scientificName,
this.year,
this.bibliography,
this.author,
this.status,
this.rank,
this.familyCommonName,
this.genusId,
this.imageUrl,
this.synonyms,
this.genus,
this.family,
});
Data.fromJson(Map<String, dynamic> json) {
id = json['id'];
commonName = json['common_name'];
slug = json['slug'];
scientificName = json['scientific_name'];
year = json['year'];
bibliography = json['bibliography'];
author = json['author'];
status = json['status'];
rank = json['rank'];
familyCommonName = json['family_common_name'];
genusId = json['genus_id'];
imageUrl = json['image_url'];
synonyms = json['synonyms'].cast<String>();
genus = json['genus'];
family = json['family'];
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['id'] = this.id;
data['common_name'] = this.commonName;
data['slug'] = this.slug;
data['scientific_name'] = this.scientificName;
data['year'] = this.year;
data['bibliography'] = this.bibliography;
data['author'] = this.author;
data['status'] = this.status;
data['rank'] = this.rank;
data['family_common_name'] = this.familyCommonName;
data['genus_id'] = this.genusId;
data['image_url'] = this.imageUrl;
data['synonyms'] = this.synonyms;
data['genus'] = this.genus;
data['family'] = this.family;
return data;
}
}
解决
在下面添加了这个功能
Plant plant;
Future<void> getPlant() async {
String url =
'https://trefle.io/api/v1/plants?token=jAEYseuuPFUlUss9QcNOefanIBG_fb83mkXdaRDIu8w';
Map<String, String> header = {"Content-type": "application/json"};
// make GET request
var response = await http.get(url, headers: header);
// check the status code for the result
if (response.statusCode == 200) {
setState(() {
plant = plantFromJson(response.body);
});
} else {}
}
更改了 fetchData
Future<Plant> fetchData(String url, bool asyncCall) async {
asyncCall = true;
response = await http.get(url);
final plant = plantFromJson(response.body);
print(plant);
print(plant.data);
print(plant.data[0].imageUrl);
return plant;
}
【问题讨论】:
-
我使用动态或有时根本不使用类型def。