Flutter之Json序列化

前言

使用 json_annotation 框架实现json字符串序列化和反序列化

框架官方地址:json_serializable

一、引入依赖:在pubspec.yaml中添加

复制代码
dependencies:
    json_annotation: ^4.8.1


dev_dependencies:
  build_runner: ^2.3.3
  json_serializable: ^6.6.0

二、使用过程

数据源:

复制代码
{
  "id": 1,
  "name": "John",
  "email": "john@example.com",
  "phone_numbers": [
    {
      "type": "home",
      "number": "1234567890"
    },
    {
      "type": "work",
      "number": "0987654321"
    }
  ]
}

创建数据模型:

复制代码
// 引入依赖
import 'package:json_annotation/json_annotation.dart';

// 指定此类的代码生成文件(格式:part '类名.g.dart';)
part 'Person.g.dart';

// 添加序列化标注
@JsonSerializable()
class Person {
  int id;
  String name;
  String email;
  // 使用别名
  @JsonKey(name: "phone_numbers")
  List<PhoneNumber> phoneNumbers;

  Person(this.id, this.name, this.email, this.phoneNumbers);
  // 添加反序列化方法(格式:factory 类名.fromJson(Map<String, dynamic> json) => _$类名FromJson(json);)
  factory Person.fromJson(Map<String,dynamic> json) => _$PersonFromJson(json);
  // 添加序列化方法(格式:Map<String, dynamic> toJson() => _$类名ToJson(this);)
  Map<String,dynamic> toJson() => _$PersonToJson(this);
}

@JsonSerializable()
class PhoneNumber {
  String type;
  String number;

  PhoneNumber(this.type, this.number);
  factory PhoneNumber.fromJson(Map<String,dynamic> json) => _$PhoneNumberFromJson(json);
  Map<String,dynamic> toJson() => _$PhoneNumberToJson(this);
}

使用命令生成对应的.g.dart内容

在android studio的Terminal终端使用如下命令:

复制代码
flutter pub run build_runner build

命令生成过程:

复制代码
PS D:\AndroidStudioProjects\github_client_app> flutter pub run build_runner build
Deprecated. Use `dart run` instead.
Building package executable... (5.9s)
Built build_runner:build_runner.
[INFO] Generating build script completed, took 252ms
[INFO] Reading cached asset graph completed, took 73ms
[INFO] Checking for updates since last build completed, took 685ms
[INFO] Running build completed, took 19.0s
[INFO] Caching finalized dependency graph completed, took 87ms
[INFO] Succeeded after 19.1s with 602 outputs (606 actions)
PS D:\AndroidStudioProjects\github_client_app> flutter pub run build_runner build
Deprecated. Use `dart run` instead.
[INFO] Generating build script completed, took 252ms
[INFO] Reading cached asset graph completed, took 193ms
[INFO] Checking for updates since last build completed, took 683ms
[INFO] Running build completed, took 10.1s
[INFO] Caching finalized dependency graph completed, took 86ms
[INFO] Succeeded after 10.2s with 189 outputs (193 actions)

查看Person.g.dart

复制代码
// GENERATED CODE - DO NOT MODIFY BY HAND

part of 'Person.dart';

// **************************************************************************
// JsonSerializableGenerator
// **************************************************************************

Person _$PersonFromJson(Map<String, dynamic> json) => Person(
      json['id'] as int,
      json['name'] as String,
      json['email'] as String,
      (json['phone_numbers'] as List<dynamic>)
          .map((e) => PhoneNumber.fromJson(e as Map<String, dynamic>))
          .toList(),
    );

Map<String, dynamic> _$PersonToJson(Person instance) => <String, dynamic>{
      'id': instance.id,
      'name': instance.name,
      'email': instance.email,
      'phone_numbers': instance.phoneNumbers,
    };

PhoneNumber _$PhoneNumberFromJson(Map<String, dynamic> json) => PhoneNumber(
      json['type'] as String,
      json['number'] as String,
    );

Map<String, dynamic> _$PhoneNumberToJson(PhoneNumber instance) =>
    <String, dynamic>{
      'type': instance.type,
      'number': instance.number,
    };

使用示例:

复制代码
void jsonTest() {
    final json = '''
{
  "id": 1,
  "name": "John",
  "email": "john@example.com",
  "phone_numbers": [
    {
      "type": "home",
      "number": "1234567890"
    },
    {
      "type": "work",
      "number": "0987654321"
    }
  ]
}
''';
    final person = Person.fromJson(jsonDecode(json));
    print("steve:${person.name}");
    final jsonEncoded = jsonEncode(person.toJson());
    print("steve:$jsonEncoded");
  }

打印的日志:

复制代码
I/flutter ( 1781): steve:John
I/flutter ( 1781): steve:{"id":1,"name":"John","email":"john@example.com","phone_numbers":[{"type":"home","number":"1234567890"},{"type":"work","number":"0987654321"}]}

补充:

jsonKey

  • nullable:默认为true,表示该字段可为null
  • defaultValue:如果源JSON不包含该key或该keyvaluenull,提供一个默认值。
  • name:别名,若为null则默认为字段名。
  • required:默认为false,若为真会检查JSON是否包含该key,若没有则抛出异常(keynull也是有效的)。

生成.g.dart文件

一次性构建
复制代码
flutter packages pub run build_runner build
删除后重新构建
复制代码
flutter packages pub run build_runner build --delete-conflicting-outputs
自动为后续创建的数据模型创建
复制代码
flutter packages pub run build_runner watch
相关推荐
决斗小饼干11 小时前
序列化 JSON 时崩了?99% 是 EF 延迟加载惹的祸,三种解法拿走不谢
json
Lanren的编程日记12 小时前
Flutter鸿蒙应用开发:数据加密功能实现实战,全方位保护用户隐私数据
flutter·华为·harmonyos
ZC跨境爬虫12 小时前
3D 地球卫星轨道可视化平台开发 Day9(AI阈值调控+小众卫星识别+低Token测试模式实战)
人工智能·python·3d·信息可视化·json
ZC跨境爬虫12 小时前
3D 地球卫星轨道可视化平台开发 Day6(SEC数据接口扩展实现)
前端·microsoft·3d·html·json·交互
梦想不只是梦与想12 小时前
flutter 与 Android iOS 通信?以及实现原理(一)
android·flutter·ios·methodchannel·eventchannel·basicmessage
Hello--_--World13 小时前
ES16:Set 集合方法增强、Promise.try、迭代器助手、JSON 模块导入 相关知识
开发语言·javascript·json
2601_9495936514 小时前
Flutter OpenHarmony 三方库 path_provider 文件路径获取适配详解
flutter
哈撒Ki15 小时前
快速入门 Dart 语言
前端·flutter·dart
小蜜蜂嗡嗡15 小时前
flutter 自定义走马灯,内部为Widget控件的走马灯效果二:横向无限匀速滚动+每个Item与屏幕左侧对齐时,停靠3秒再继续滚动
开发语言·flutter
浮芷.15 小时前
生命科学数据视界防御:基于鸿蒙Flutter陀螺仪云台与三维体积光栅的视轴锁定架构
flutter·华为·架构·开源·harmonyos·鸿蒙