Flutter网络数据处理-json序列化

前言

网络请求返回的数据,为了方便快捷地在UI上的控件上调用并展示,一般我们都会定义一个模型类来填充网络请求返回的json数据,用类对象的属性调用的方式,即可以防止在运行过程中出现不可预知的错误,又可以快捷地知道某个控件上需要显示哪个数据,所以将json数据转为model类可以更好地提升我们的开发效率。

众所周知,若我们手动去序列化json数据,那将是一个很痛苦的过程,这样反而增加了工作量,得不偿失。幸好,Flutter也提供了自动序列化的三方库:json_serializable

步骤

废话不多说,直接上配置步骤:

1、在pubspec.yaml中添加

dependencies:
  json_annotation: ^2.0.0

dev_dependencies:
  build_runner: ^1.0.0
  json_serializable: ^2.0.0

保存或者终端运行flutter packages get,项目中就会添加以上依赖。

2、新建一个model类,如user.dart,以下每个步骤都是需要我们手动输入的

// 1、引入json_annotation.dart
import 'package:json_annotation/json_annotation.dart';

// 2、这里手动输入:user.g.dart文件将在我们运行生成命令后自动生成
part 'user.g.dart';

// 3、这个标注是告诉生成器,这个类是需要生成Model类的
@JsonSerializable()

class User{
  // 4、定义网络数据json返回属性值
  String? name;
  String? email;

  // 5、必须的方法
  User(this.name, this.email);

  // 6、必须的代码:代码格式是固定的,将下面的“User”关键词替换为你定义的model类名称即可
 // 反序列化
  factory User.fromJson(Map<String, dynamic> json) => _$UserFromJson(json);
 // 序列化
  Map<String, dynamic> toJson() => _$UserToJson(this);
}

3、如果想要用自定义的属性名称,不想用服务端返回的属性名称

@JsonKey(name: 'user_id')
final int userId;

4、如果有些字段不想去解析,可以这样

@JsonKey(ignore: true)
  int? age; 

5、打开终端,在项目根目录下运行:

一次性生成:

flutter packages pub run build_runner build

自动监控生成:

flutter packages pub run build_runner watch

以上步骤都操作完后,在model类同级目录下就会生成对应的model.g.dart文件;接下来就可以使用创建好的模型类了。

效果

1、完整代码:

import 'package:json_annotation/json_annotation.dart';

part 'user.g.dart';

@JsonSerializable()

class User{
  String? name;
  String? email;

  @JsonKey(name: 'user_id')
  int? userId;
  @JsonKey(ignore: true)
  int? age; 

  User(this.name, this.email, this.userId);

  factory User.fromJson(Map<String, dynamic> json) => _$UserFromJson(json);
  Map<String, dynamic> toJson() => _$UserToJson(this);
}

2、运行完flutter packages pub run build_runner build后

截屏2021-07-13 下午11.06.53.png

终端打印以上代码,表示model.g.dart文件已经生成成功了。

若报错:
Conflicting outputs were detected and the build is unable to prompt for permission to remove them. These outputs must be removed manually or the build can be run with --delete-conflicting-outputs. The outputs are: lib/model/user.g.dart

应该是本地已经存在user.g.dart文件,需要清除。

解决方案:
运行以下两个命令:

flutter packages pub run build_runner clean
flutter packages pub run build_runner build --delete-conflicting-outputs

3、运行完flutter packages pub run build_runner watch后

截屏2021-07-13 下午11.14.56.png

若终端打印以上代码,表示实时监控已打开,只要修改了model类的属性并保存,model.g.dart文件里的代码也会自动生成。

需要注意的是,打开了watch,可能会影响hot load,若已经生成了model.g.dart文件,建议关闭watch,下次修改时再次打开即可。

结语

好了,网络json数据序列化就到这里了,有问题的可以留言或私信我,对你有帮助的话,也可以点个赞哦!

参考文档

https://flutterchina.club/json/
https://www.codercto.com/a/89377.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,504评论 6 496
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,434评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,089评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,378评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,472评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,506评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,519评论 3 413
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,292评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,738评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,022评论 2 329
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,194评论 1 342
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,873评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,536评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,162评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,413评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,075评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,080评论 2 352

推荐阅读更多精彩内容