Flutter:如何将接收到的数据作为嵌套列表放在模型上
Flutter : How put received data on model as nested List
我正在尝试通过 flutter 和 Laravel 为后端创建购物应用程序,我创建了后端并在邮递员上对其进行了测试并且工作正常,现在我想通过 flutter depend 设计 UI关于数据来自 API,首先我想查看所有类别和每个类别的所有产品,我从 API 收到数据,如下所示:
[
{
"id": 1,
"name": "cars",
"created_at": "-000001-11-30T00:00:00.000000Z",
"updated_at": null,
"product": [
{
"id": 1,
"product_name": "mercides",
"category_id": 1,
"price": "120000",
"sale": "0",
"created_at": null,
"updated_at": null
},
]
},
]
我在模型文件夹中创建了一个 class 来放置数据:
import 'dart:convert';
List<Categories> categoriesFromMap(String str) =>
List<Categories>.from(json.decode(str).map((x) => Categories.fromMap(x)));
String categoriesToMap(List<Categories> data) =>
json.encode(List<dynamic>.from(data.map((x) => x.toMap())));
class Categories {
Categories({
this.id,
this.name,
this.product,
});
final int id;
final String name;
final List<Product> product;
factory Categories.fromMap(Map<String, dynamic> json) => Categories(
id: json["id"],
name: json["name"],
product:
List<Product>.from(json["product"].map((x) => Product.fromMap(x))),
);
Map<String, dynamic> toMap() => {
"id": id,
"name": name,
"product": List<dynamic>.from(product.map((x) => x.toMap())),
};
}
class Product {
Product({
this.id,
this.productName,
this.categoryId,
this.price,
this.sale,
});
final int id;
final String productName;
final int categoryId;
final String price;
final String sale;
factory Product.fromMap(Map<String, dynamic> json) => Product(
id: json["id"],
productName: json["product_name"],
categoryId: json["category_id"],
price: json["price"],
sale: json["sale"],
);
Map<String, dynamic> toMap() => {
"id": id,
"product_name": productName,
"category_id": categoryId,
"price": price,
"sale": sale,
};
}
现在我想从 URL 接收数据并在此函数中将其转换为 Future List :
Future<List> get_data() async {
var url = 'http://10.0.2.2:8000/api/user/cats_view';
var response = await http.get(url);
var data = jsonDecode(response.body);
}
我该怎么做,如何在 class 或任何其他方式上使用 categoriesToMap() 函数?
您可以使用 categoriesFromMap
函数将响应正文转换为 Categories
的列表。我已经包含了 get_data
函数的最小工作示例:
Future<List<Categories>> get_data() async {
var url = 'http://10.0.2.2:8000/api/user/cats_view';
var response = await http.get(url);
var data = categoriesFromMap(response.body);
}
有关反序列化响应的详细信息,请参阅文档 here。
我正在尝试通过 flutter 和 Laravel 为后端创建购物应用程序,我创建了后端并在邮递员上对其进行了测试并且工作正常,现在我想通过 flutter depend 设计 UI关于数据来自 API,首先我想查看所有类别和每个类别的所有产品,我从 API 收到数据,如下所示:
[
{
"id": 1,
"name": "cars",
"created_at": "-000001-11-30T00:00:00.000000Z",
"updated_at": null,
"product": [
{
"id": 1,
"product_name": "mercides",
"category_id": 1,
"price": "120000",
"sale": "0",
"created_at": null,
"updated_at": null
},
]
},
]
我在模型文件夹中创建了一个 class 来放置数据:
import 'dart:convert';
List<Categories> categoriesFromMap(String str) =>
List<Categories>.from(json.decode(str).map((x) => Categories.fromMap(x)));
String categoriesToMap(List<Categories> data) =>
json.encode(List<dynamic>.from(data.map((x) => x.toMap())));
class Categories {
Categories({
this.id,
this.name,
this.product,
});
final int id;
final String name;
final List<Product> product;
factory Categories.fromMap(Map<String, dynamic> json) => Categories(
id: json["id"],
name: json["name"],
product:
List<Product>.from(json["product"].map((x) => Product.fromMap(x))),
);
Map<String, dynamic> toMap() => {
"id": id,
"name": name,
"product": List<dynamic>.from(product.map((x) => x.toMap())),
};
}
class Product {
Product({
this.id,
this.productName,
this.categoryId,
this.price,
this.sale,
});
final int id;
final String productName;
final int categoryId;
final String price;
final String sale;
factory Product.fromMap(Map<String, dynamic> json) => Product(
id: json["id"],
productName: json["product_name"],
categoryId: json["category_id"],
price: json["price"],
sale: json["sale"],
);
Map<String, dynamic> toMap() => {
"id": id,
"product_name": productName,
"category_id": categoryId,
"price": price,
"sale": sale,
};
}
现在我想从 URL 接收数据并在此函数中将其转换为 Future List :
Future<List> get_data() async {
var url = 'http://10.0.2.2:8000/api/user/cats_view';
var response = await http.get(url);
var data = jsonDecode(response.body);
}
我该怎么做,如何在 class 或任何其他方式上使用 categoriesToMap() 函数?
您可以使用 categoriesFromMap
函数将响应正文转换为 Categories
的列表。我已经包含了 get_data
函数的最小工作示例:
Future<List<Categories>> get_data() async {
var url = 'http://10.0.2.2:8000/api/user/cats_view';
var response = await http.get(url);
var data = categoriesFromMap(response.body);
}
有关反序列化响应的详细信息,请参阅文档 here。