用户登录

请求回来的这个列表数据需要处理一下才能使用,可以先把 JSON 格式的数据转换成 Map 类型的数据,然后再把它转换成某个特定类型的数据,这些类型里面我要使用 Json Serializable 自动生成 fromJson 还有 toJson 方法,这些类都有一些共同的地方,所以我提前准备了两个代码片断。

在 .vscode 下面,打开定义代码片断的这个文件,xb2_flutter.code-snippets,这里你会看到有一个 JsonSerializable Import 代码片断,输入 jsli 可以得到这个代码片断,这个代码片断带导入。下面还有一个 JsonSerializable 片断,这个片断不带导入,可以用 jsl 这个关键词快速得到这个代码片断。你可以找到这个项目的代码仓库,然后复制这个文件里的这两个代码片断,把它放在你自己的项目里的这个文件里面。

Post

下面可以新建一个文件,放在 lib/post 的下面,名字是 post.dart,我们可以根据请求接口得到的这组数据,去定义一下这个类型。输入 jsli ,可以快速得到一个数据类型,part 文件的名字叫 post.g.dart,这个文件一会儿会使用命令自动生成。按下 tab 键,输入类的名字,Post。

这个类里面有一个工厂方法,名字是 fromJson ,方法接收一个参数,类型是 Map 名字是 json,注意这个 json 参数的值应该是一个 Map 类型的数据。方法 return 的东西可以用一下 _$PostFromJson 把 json 交给这个方法,这个方法一会儿我们会用命令去生成。

类里面还有一个方法叫 toJson,它返回的类型是 Map,返回的值会用 _$PostToJson 这个方法得到,把 this 交给这个方法。调用这个方法的时候会把这个 Post 类型的数据转换成一个普通的 Map 数据。

这个类会使用 @JsonSerializable 注释一下,可以把它的 explicitToJson 这个参数的值设置成  true,这样会明确地调用这个类型嵌套的类型的 toJson 方法。

下面在这个类里面再去添加一些属性,int? 类型的 id,String? 类型的 title,String? 类型的 content,再添加一个 PostUser? 类型的 user,一会儿再去定义这个 PostUser,再添加一个 int? 类型的 totalComments,然后是 PostFile? 类型的 file,List? 类型的 tags,int? 类型的 totalLikes,还有一个 int? 类型的 liked。

在构造方法里面添加一些参数,this.id,this.title,this.content,this.user,this.totalComments ,this.file,this.tags,this.totalLikes,还有 this.liked 。

PostUser

然后再去定义这里需要的 PostUser,PostFile 还有  PostTag 这些类型。定义一个类,名字是 PostUser,里面添加几个属性,int? id,String? name,还有 int? avatar。在构造方法里,添加一个 this.id,this.name 还有 this.avatar。

PostFile

下面再定义一个 PostFile 这个类型,它里面有 int? id,int? width,还有 int? height ,在构造方法里添加一个 this.id,this.width 还有 this.height。

PostTag

最后再定义一个类型,名字叫 PostTag,添加两个属性,int? id,String? name, 在构造方法里添加一个 this.id,还有  this.name。

运行 build 命令

在终端,项目所在目录的下面,运行一下 flutter pub run build_runner build ,这个命令会根据刚才定义的类型,自动生成需要的代码。完成以后,你会发现这里多了一个文件,名字是 post.g.dart,在这个文件里会包含自动生成的一些方法。

这些方法在 post.dart 这个文件里定义的这些类里面会用到,定义这些类的时候,我们把  JsonSerializable 的 explicitToJson 设置成了 true,所以在自动生成的对应的 ToJson 方法里面,如果有嵌套的类型,这里会明确的调用它的 toJson() 方法。

定义内容数据类型《 Flutter 2:内容列表 》

统计

13559
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点