在flutter中显示来自json的数据

Question

我想在主页上显示一个餐馆列表，但是在餐馆模型中，我在构造函数部分有一个错误。在主页上也有一个错误，说"参数类型'字符串?'不能赋值给参数类型'String'."快照。数据组，你能帮我解决一下吗?

模型:

import 'dart:convert';
class RestaurantDetail {
final Restaurant restaurants;
RestaurantDetail({this.restaurants});
factory RestaurantDetail.fromJson(Map<String, dynamic> json) {
return RestaurantDetail(
restaurants: Restaurant.fromJson(json['restaurants']),
);
}
}
class Restaurant {
final String id;
final String name;
final String description;
final String pictureId;
final String city;
final double rating;
final Menus menus;
Restaurant({
this.id,
this.name,
this.description,
this.pictureId,
this.city,
this.rating,
this.menus,
});
factory Restaurant.fromJson(Map<String, dynamic> json) {
return Restaurant(
id: json['id'],
name: json['name'],
description: json['description'],
pictureId: json['pictureId'],
city: json['city'],
rating: json['rating'],
menus: Menus.fromJson(json['menus']),
);
}
}
class Menus {
final Foods foods;
final Drinks drinks;
Menus({
this.foods,
this.drinks,
});
factory Menus.fromJson(Map<String, dynamic> json) {
return Menus(
foods: Foods.fromJson(json['foods']),
drinks: Drinks.fromJson(json['drinks']));
}
}
class Foods {
final String name;
Foods({this.name});
factory Foods.fromJson(Map<String, dynamic> json) {
return new Foods(
name: json['name'],
);
}
}
class Drinks {
final String name;
Drinks({this.name});
factory Drinks.fromJson(Map<String, dynamic> json) {
return new Drinks(
name: json['name'],
);
}
}
List<RestaurantDetail> parseRestaurant(String json) {
if (json == null) {
return [];
}
final List parsed = jsonDecode(json);
return parsed.map((json) => RestaurantDetail.fromJson(json)).toList();
}

主页:

import 'package:flutter/material.dart';
import 'package:restaurant/data/restaurant.dart';
import 'package:restaurant/style/theme.dart';
class HomePage extends StatelessWidget {
static const routeName = '/article_list';
const HomePage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: kBackgroundColor,
body: FutureBuilder<String>(
future: DefaultAssetBundle.of(context)
.loadString('assets/local_restaurant.json'),
builder: (context, snapshot) {
final List<RestaurantDetail> restaurants =
parseRestaurant(snapshot.data);
return ListView.builder(
itemCount: restaurants.length,
itemBuilder: (context, index) {
return _buildRestaurantItem(context, restaurants[index]);
},
);
},
),
);
}
Widget _buildRestaurantItem(
BuildContext context, RestaurantDetail restaurantDetail) {
return ListTile(
contentPadding:
const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
leading: Image.network(
restaurantDetail.restaurants.pictureId,
width: 100,
),
title: Text(restaurantDetail.restaurants.name),
subtitle: Text(restaurantDetail.restaurants.city),
onTap: () {},
);
}
}

Answer 1

似乎你的代码有很多抱怨，因为它实际上不是为了支持null安全而编写的。如果您仍然不熟悉null安全，则应该在pubspec.yaml文件中选择较低的dart sdk版本。我用这个dart sdk版本检查了你的代码

sdk: ">=2.7.0 <3.0.0"

和分析器发现它没有问题(没有警告或红色下划线代码)。从这个版本开始支持空安全:

sdk: ">=2.12.0 <3.0.0"

使用它，您将获得null安全警告。因此，如果您不是故意选择这个版本，并且您不想要null安全，我建议您选择较低的版本。例如，如前所述，sdk: ">=2.7.0 <3.0.0"。String?表示String为空。为了表明变量的值可能为null，我们将?添加到它的类型声明中。更多的参考，如果你想要支持null安全，我建议你查看Sound null安全指南。