准备热门内容列表

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

默认在最近这个页面上显示的是最近发布的一些内容,我们在热门这个页面可以换一种排序方式来展示这些内容列表。

getPosts

先打开 post_index_model.dart ,请求内容列表数据的时候会执行这里的 getPosts 这个方法,现在请求的地址是 /posts,我们可以通过 sort 这个查询符来设置内容列表的排序方式,这些排序方式是在服务端应用那里规定好的。

默认这个 sort 查询符的值会是 latest,请求这个接口地址可以得到一组最近发布的内容,如果把这个 sort 查询符的值设置成 most_comments,这样获取到的就是按评论数量排序的一组内容。

在这个 getPosts 方法里,添加一个带名字的参数,用 required 标记一下,类型是 Stirng,名字是 sort,表示排序方式。把 sort 查询符的值设置成 $sort 。

post_list.dart

再打开 post_list.dart,在这个小部件里添加一个属性,类型是 String? 名字是 sort,然后添加一个构造方法,PostList,添加一个带名字的参数,this.sort。

在这个小部件的状态类里面,在 initState 这个方法里,用了一下 getPosts 这个方法获取内容列表数据,现在这个方法要设置一个 sort 参数,添加一个 sort 参数,值是 widget.sort ,如果它的值是 null,就把 sort 参数的值设置成 latest。

post_index_popular.dart

然后打开 post_index_popular.dart,设置一下小部件的 build 方法,返回一个 Container ,里面用 padding 添加点边距,EdgeInsets.all,大小是 16。设置一下它的 child,对应的是一个 PostList 小部件,把小部件的 sort 设置成 most_comments。

测试

打开编辑器的调试,重新启动一下。然后在模拟器上再测试一下,最近这个页面现在会显示最近发布的一组内容。再打开热门这个标签,这里会显示一组按评论数量排序的内容。

准备热门内容列表《 Flutter 2:列表布局 》

统计

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

社会化网络

关于

微信订阅号

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