在颤动中显示来自json的数据

Question

我想在主页上显示餐厅列表，但在餐厅模型中，构造函数部分出现错误。在主页上还有一个错误，上面写着“参数类型'String？'不能分配给参数类型“字符串”。” snapshot.data 部分，你能帮我解决一下吗？

型号：

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 安全性，您应该在 pubspec.yaml 文件中选择较低的 dart sdk 版本。我用这个 dart sdk 版本检查了你的代码

sdk: ">=2.7.0 <3.0.0"

并且分析器没有发现任何问题（没有警告或红色下划线代码）。从这个版本开始支持空安全：

sdk: ">=2.12.0 <3.0.0"

有了它，您将收到无效的安全警告。因此，如果您没有故意选择此版本，并且您不想要零安全性，我应该建议您选择较低的版本。例如，如前所述，sdk: ">=2.7.0 <3.0.0"。 String? 表示 String 可以为空。为了表明一个变量可能具有 null 值，我们将? 添加到它的类型声明中。如需更多参考，并且如果您确实想支持 null 安全性，我建议您在 Sound null safety 上查看本指南。