一. 数据转换

  • 在Flutter代码中直接将JSON转成Map来使用非常麻烦，且类型会不容易确定，不安全；

  • 所以对于面向对象开发的语言，通常都会将它转成模型对象，之后使用一个个模型对象；

    二. 手动转化

    手动实现JSON转模型：

  • 优点：完全自己可控，并且需要哪些就转化哪些，不需要的可忽略；继承关系清晰；

  • 缺点：麻烦，并且容易出错； ```dart class Person { String name; String avatarURL;

    Person.fromMap(Map json) { this.name = json[“name”]; this.avatarURL = json[“avatars”][“medium”]; } }

class Actor extends Person { Actor.fromMap(Map json): super.fromMap(json); }

class Director extends Person { Director.fromMap(Map json): super.fromMap(json); }

int counter = 1;

class MovieItem { int rank; String imageURL; String title; String playDate; double rating; List genres; List casts; Director director; String originalTitle;

MovieItem.fromMap(Map json) { this.rank = counter++; this.imageURL = json[“images”][“medium”]; this.title = json[“title”]; this.playDate = json[“year”]; this.rating = json[“rating”][“average”]; this.genres = json[“genres”].cast(); this.casts = (json[“casts”] asList).map((item) { return Actor.fromMap(item); }).toList(); this.director = Director.fromMap(json[“directors”][0]); this.originalTitle = json[“original_title”]; } }

  1. <a name="BCglk"></a>
  2. ## 三. json_serializable
  3. json_serializable是dart官方推荐和提供的JSON转Model的方式：
  5. - 一个自动化源代码生成器来为你生成 JSON 序列化数据模板；
  6. - 序列化数据代码不需要手动编写或者维护，可以将序列化 JSON 数据在运行时的异常风险降到最低；
  8. **第一步：添加相关的依赖**<br />依赖分为项目依赖（dependencies），开发依赖（dev_dependencies）:
  10. - 注意：需要执行flutter pub get确保我们的项目中有这些依赖
  11. ```dart
  12. dependencies:
  13.   json_annotation:^3.0.1
  15. dev_dependencies:
  16.   json_serializable:^3.2.5
  17.   build_runner:^1.8.0

第二步：以json_serializable 的方式创建模型类
这里不以豆瓣数据为例，以一个简单的Json数据作为例子

  1. final jsonInfo = {
  2.   "nickname": "wulei",
  3.   "level": 18,
  4.   "courses": ["语文", "数学", "英语"],
  5.   "register_date": "2222-2-22",
  6.   "computer": {
  7.     "brand": "MackBook",
  8.     "price": 1000
  9.   }
  10. };

创建对应的模型（以json_serializable 的方式，创建完成后代码是报错的）

  • 1.part ‘user.g.dart’
    • 这个是之后json_serializable会自动帮助我们生成的文件
  • 2.JsonSerializable()
    • 注解：告诉json_serializable哪一个类需要进行转换
  • 3.JsonKey
    • 当映射关系不一样时，可以指定映射关系
  • 4.另外，这里必须有我们的构造方法
  • 5.需要有对应的工厂构造器
    • _UserToJson(this)调用的该方法目前会报错，需要json_serializable来生成
  • 6.toString方法不是必须的，是待会儿进行测试的

User类的代码：

  1. import'package:json_annotation/json_annotation.dart';
  2. import'model/computer.dart';
  4. part'user.g.dart';
  6. @JsonSerializable()
  7. class User {
  8.   String name;
  9.   String email;
  10.   @JsonKey(name: "register_date")
  11.   String registerDate;
  12.   List<String> courses;
  13.   Computer computer;
  15.   User(this.name, this.email, this.registerDate, this.courses, this.computer);
  17.   factory User.fromJson(Map<String, dynamic> json) => _$UserFromJson(json);
  18.   Map<String, dynamic> toJson() => _$UserToJson(this);
  20.   @override
  21.   String toString() {
  22.     return'User{name: $name, email: $email, registerDate: $registerDate, courses: $courses, computer: $computer}';
  23.   }
  25. }
  27. Computer类的代码：
  28. import'package:json_annotation/json_annotation.dart';
  30. part'computer.g.dart';
  32. @JsonSerializable()
  33. class Computer {
  34.   String brand;
  35.   double price;
  37.   Computer(this.brand, this.price);
  39.   factory Computer.fromJson(Map<String, dynamic> json) => _$ComputerFromJson(json);
  40.   Map<String, dynamic> toJson() => _$ComputerToJson(this);
  42.   @override
  43.   String toString() {
  44.     return'Computer{brand: $brand, price: $price}';
  45.   }
  46. }

第三步：生成JSON序列化代码
在项目终端运行下面的指令：

  • 该指令是生成一次JSON序列化的代码

    1. flutter pub run build_runner build

    或运行下面的指令：

  • 会监听文件的改变，重新生成JSON序列化的代码

    1. flutter pub run build_runner watch

    第四步：测试代码

    四. 网页转换

    目前有一些网页，可以直接将JSON转成Model

  • 网页推荐：https://javiercbk.github.io/json_to_dart/

    五. 编辑器插件

    目前也有一些AndroidStudio或者VSCode的插件，来直接将JSON生成对应的Model

  • Android Studio推荐FlutterJsonBeanFactory