首页 > 解决方案 > Flutter:如何将 JSON 加载到 PageView

问题描述

我希望有人能告诉我如何将 JSON 加载到 PageView 中。PageView 中的每个页面都将包含一个 ListView,它将使用 Card 小部件来显示 JSON 中的每个作业。

JOB_DATE 将指示作业显示在哪个页面上。所以在下面的 JSON 中,前 3 个项目在一个日期,接下来的 2 个项目在下一个日期。所以第 1 页应该显示前 3 项,第 2 页应该显示第 4 和第 5 项。

JSON:

{
   "rows":[
      { "JOBID":23, "JOB_DATE":1588809600000, "START_TIME":"07:30", "JOB_NAME":"Cleaner" },
      { "JOBID":24, "JOB_DATE":1588809600000, "START_TIME":"08:30", "JOB_NAME":"Manager" }
      { "JOBID":25, "JOB_DATE":1588809600000, "START_TIME":"12:30", "JOB_NAME":"Caretaker" }
      { "JOBID":26, "JOB_DATE":1588896000000, "START_TIME":"08:30", "JOB_NAME":"Manager" }
      { "JOBID":27, "JOB_DATE":1588896000000, "START_TIME":"13:30", "JOB_NAME":"Caretaker" }
   ]
}

我将如何编码以将 JSON 拆分到不同的页面?

非常感谢您的帮助。

干杯,

保罗

标签: flutter

解决方案


你可以从'package:collection/collection.dart'中分组功能

var json = {
   "rows":[
      { "JOBID":23, "JOB_DATE":1588809600000, "START_TIME":"07:30", "JOB_NAME":"Cleaner" },
      { "JOBID":24, "JOB_DATE":1588809600000, "START_TIME":"08:30", "JOB_NAME":"Manager" }
      { "JOBID":25, "JOB_DATE":1588809600000, "START_TIME":"12:30", "JOB_NAME":"Caretaker" }
      { "JOBID":26, "JOB_DATE":1588896000000, "START_TIME":"08:30", "JOB_NAME":"Manager" }
      { "JOBID":27, "JOB_DATE":1588896000000, "START_TIME":"13:30", "JOB_NAME":"Caretaker" }
   ]
}

List<Map<String, dynamic> rows = json['rows']
Map<dynamic, List<Map<String, dynamic>> sortedRow = groupBy(rows, (row) => row['JOB_DATE']

您将拥有一个映射,其中键是 (1588809600000, 1588896000000),值是对象列表。

之后,您可以使用对象的 ListView 创建 PageView


推荐阅读