我试图从API获取列表。它显示错误-
范围错误(索引):无效值:唯一有效值为0:2
我正在练习fetch API。你能告诉我我的代码有什么问题,以及如何避免在我的应用程序中显示红屏错误吗?
这是代码-
RefreshIndicator(
onRefresh: () {
setState(() {});
return fetchOpenMenuList(widget.product);
},
child: FutureBuilder<MenuListData>(
future: futureOpenMenuList,
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView.builder(
padding: EdgeInsets.symmetric(vertical: 8.h),
itemCount: snapshot.data!.data.length,
itemBuilder: (BuildContext context, int index) {
return ListTile(
leading: Image.network(
snapshot.data!.data[index]!.items[index].thumb.toString()
),
title: Text(snapshot.data!.data[index]!.items[index].prodName),
subtitle: Text(snapshot.data!.data[index]!.name),
trailing: Container(
padding: EdgeInsets.all(5.r),
decoration: BoxDecoration(
color: Colors.transparent,
borderRadius: BorderRadius.circular(10.r),
),
child: Image.asset("assets/images/MenuIcon.png", height: 20.h, width: 20.w)
),
);
},
);
} else if (snapshot.hasError) {
return Center(child: Text('No Data Found'));
}
return const Center(
child: SizedBox(
height: 50.0,
width: 50.0,
child: CircularProgressIndicator(),
),
);
},
),
),
这是我的JSON文件
{
"ignore": 0,
"code": 1,
"message": "OK",
"data": [
{
"ctg_id": "1",
"name": "Fusion",
"items": [
{
"prod_id": "1",
"prod_name": "Italian Sev Puri",
"thumb": "http:\/\/www.galacaterers.in\/images\/menu-items\/thumb-1459925145.jpg"
}
]
},
{
"ctg_id": "5",
"name": "Cake And Pastries",
"items": [
{
"prod_id": "57",
"prod_name": "Molt And Magic",
"thumb": "http:\/\/www.galacaterers.in\/images\/menu-items\/thumb-1459945416.jpg"
},
{
"prod_id": "49",
"prod_name": "Chocolate Zuzups",
"thumb": "http:\/\/www.galacaterers.in\/images\/menu-items\/thumb-1459945068.jpg"
}
]
},
{
"ctg_id": "6",
"name": "Chaat",
"items": [
{
"prod_id": "99",
"prod_name": "Makai Roll Chaat",
"thumb": "http:\/\/www.galacaterers.in\/images\/menu-items\/thumb-1459966275.jpg"
}
]
},
{
"ctg_id": "46",
"name": "Sweet Bite",
"items": [
{
"prod_id": "23",
"prod_name": "Fruit Wati",
"thumb": "http:\/\/www.galacaterers.in\/images\/menu-items\/thumb-1459942869.jpg"
}
]
}
]
}
以下是错误的截图:
我想要的:
这是数据模型-
import 'dart:convert';
MenuListData menuListDataFromJson(String str) => MenuListData.fromJson(json.decode(str));
String menuListDataToJson(MenuListData data) => json.encode(data.toJson());
class MenuListData {
MenuListData({
required this.ignore,
required this.code,
required this.message,
required this.data,
});
int ignore;
int code;
String message;
List<Datum> data;
factory MenuListData.fromJson(Map<String, dynamic> json) => MenuListData(
ignore: json["ignore"],
code: json["code"],
message: json["message"],
data: List<Datum>.from(json["data"].map((x) => Datum.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"ignore": ignore,
"code": code,
"message": message,
"data": List<dynamic>.from(data.map((x) => x.toJson())),
};
}
class Datum {
Datum({
required this.ctgId,
required this.name,
required this.items,
});
String ctgId;
String name;
List<Item> items;
factory Datum.fromJson(Map<String, dynamic> json) => Datum(
ctgId: json["ctg_id"],
name: json["name"],
items: List<Item>.from(json["items"].map((x) => Item.fromJson(x))),
);
Map<String, dynamic> toJson() => {
"ctg_id": ctgId,
"name": name,
"items": List<dynamic>.from(items.map((x) => x.toJson())),
};
}
class Item {
Item({
required this.prodId,
required this.prodName,
required this.thumb,
});
String prodId;
String prodName;
String thumb;
factory Item.fromJson(Map<String, dynamic> json) => Item(
prodId: json["prod_id"],
prodName: json["prod_name"],
thumb: json["thumb"],
);
Map<String, dynamic> toJson() => {
"prod_id": prodId,
"prod_name": prodName,
"thumb": thumb,
};
}
1条答案
按热度按时间des4xlb01#
你也在使用
index
来迭代items
,这是不好的。相反,从items
中获取第一个元素。你的
ListTile
代码应该是这样的。已编辑
我用
Column
添加了临时修复,用于迭代数据中的项。希望这是你的目标档案。