Flutter | 老孟

微信交流群

老孟公众号

网络请求返回的数据通常是 json 格式，因此将 json 格式转换为 model 格外重要。

假设 json 字符串如下：

{
  "name": "flutter",
  "age": 2,
  "email": "flutter@example.com"
}

1
2
3
4
5

定义其对应 Model类：User

class User {
  final String name;
  final int age;
  final String email;

  User({this.name, this.age, this.email});

  @override
  String toString() {
    return 'name:$name,age:$age,email:$email';
  }
}

1
2
3
4
5
6
7
8
9
10
11
12

解析：

String jsonStr = "{\"name\":\"laomeng\",\"age\":12,\"email\":\"flutter@example.com\"}";
    var jsonMap = json.decode(jsonStr);
    var user =
        User(name: jsonMap['name'], age: jsonMap['age'], email: jsonMap['email']);
    print('$user');

1
2
3
4
5

控制台输出：

flutter: name:laomeng,age:12,email:flutter@example.com

上面的案例中，json 仅有3个字断，实际业务中往往有10多个属性，通过手写的方式不仅容易出错，而且效率极低。

因此就想到了类似 Gson 框架，通过 json直接生成 Model 对象，但由于 Flutter 禁止使用反射，所以类似 Gson 这样通过反射进行序列化的方式是行不通了。

类似 Gson 框架需要使用运行时反射，这在Flutter中是禁用的。运行时反射会干扰Dart的tree shaking_。使用_tree shaking，我们可以在发版时“去除”未使用的代码。这可以显着优化应用程序的大小。

机智如Google官方，当然也注意到了此问题，因此 Google 官方提供了一套解决方案：json_serializable。

# json_serializable

在pubspec.yaml添加开发依赖：

dev_dependencies:
  json_serializable: ^3.0.0
  build_runner: ^1.6.1

1
2
3

注意，这个是开发依赖项，它是开发过程中的一些辅助工具，依赖添加到 dev_dependencies 而不是 dependencies。添加完依赖后执行“flutter packages get”，执行完毕就可以使用 json_serializable了。

User 修改如下：

import 'package:json_annotation/json_annotation.dart';

part 'user.g.dart';
///
/// desc:
///
@JsonSerializable()
class User {
  final String name;
  final int age;
  final String email;

  User({this.name, this.age, this.email});

  factory User.fromJson(Map<String, dynamic> srcJson) =>
      _$UserFromJson(srcJson);

  toJson() => _$UserToJson(this);

  @override
  String toString() {
    return 'name:$name,age:$age,email:$email';
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

1、加入 part 'user.g.dart'; 2、在需要转换的实体 dart 类 前加入 @JsonSerializable() 注解，标识需要 json序列化处理 3、fromJson()、toJson() 方法的写法是固定模式，按模板修改即可 4、user.g.dart 和 文件名 需要保持一致，否则执行以下命令无效

执行完成后会在 user.dart 同级目录下生成 `user.g.dart 文件，生成代码如下：

此方式比较繁琐，并不推荐使用。