如何在JSON中通过HTTP列表收集循环

一尘不染

如何在JSON中通过HTTP列表收集循环

flutter

我正在学习颤动，但是我已经有一段时间了。我正在使用我的一个网站使其变得无头，并试图将数据输入到我的应用程序中。

我遵循的示例：https :
//flutter.dev/docs/cookbook/networking/fetch-
data

在此示例中，他们获取单个用户。如果有多个用户，我对此会有所改变，我迷失了。

例如，如果数据的结构更像：

{'users':[{'userId':1,'id':1,'title':'title1','body':'This is Body 1'},{'userId':2,'id':2,'title':'title2','body':'This is Body 2'}]

您如何使用本教程中的方法捕获该信息？您如何遍历列表并显示诸如标题和正文之类的简单内容？

阅读 223

2020-08-13

共1个答案

一尘不染

使用教程中的示例，您可以执行以下操作：

class Users {
  final List<Post> users;

  Users({this.users});

  factory Users.fromJson(Map<String, dynamic> json) {
    List<Post> tempUsers = [];
    for (int i = 0; i < json['users'].length; i++) {
      Post post = Post.fromJson(json['users'][i]);
      tempUsers.add(post);
    }
    return Users(users: tempUsers);
  }
}

这是教程中的Post类：

class Post {
  final int userId;
  final int id;
  final String title;
  final String body;

  Post({this.userId, this.id, this.title, this.body});

  factory Post.fromJson(Map<String, dynamic> json) {
    return Post(
      userId: json['userId'],
      id: json['id'],
      title: json['title'],
      body: json['body'],
    );
  }
}

要显示标题和正文列表，您可以在本教程上更改FutureBuilder，如下所示：

final Future<Users> users;

…

FutureBuilder<Users>(
  future: users,
  builder: (context, snapshot) {
    if (snapshot.hasData) {
      return ListView.builder(
        itemCount: snapshot.data.users.length,
        itemBuilder: (context, index) {
          return Column(
            children: <Widget>[
              Text('Title: ${snapshot.data.users[index].title}'),
              Text('Body: ${snapshot.data.users[index].body}'),
            ],
          );
        },
      );
    } else if (snapshot.hasError) {
      return Text("${snapshot.error}");
    }

    // By default, show a loading spinner.
    return CircularProgressIndicator();
  },
),

我推荐您这篇文章，以了解有关解析JSON的更多信息：在Flutter中解析复杂的JSON

此外，您还可以在此处找到有关如何进行手动序列化和自动序列化的更多信息：
JSON和序列化

2020-08-13