【问题标题】:get data of specific user from rest api in flutter在flutter中从rest api获取特定用户的数据
【发布时间】:2020-12-23 14:15:40
【问题描述】:

我建立的每个人都构建了一个从父到子具有一对一关系的休息 API。一个父母可以有多个孩子。

这可能是端点的链接 https://example.com/api/child?email=abc@gmail.com 我的 json 结果是

{
"data": [
    {
        "id": 1,
        "name": "chi",
        "pin": 123123,
        "parent_id": 1,
        "avatar_id": null,
        "created_at": "2020-12-22T13:27:59.000000Z",
        "updated_at": "2020-12-22T13:27:59.000000Z"
    },
    {
        "id": 2,
        "name": "chi",
        "pin": 123123,
        "parent_id": 1,
        "avatar_id": null,
        "created_at": "2020-12-22T13:30:35.000000Z",
        "updated_at": "2020-12-22T13:30:35.000000Z"
    },
    {
        "id": 5,
        "name": "jazzzz",
        "pin": 12121212,
        "parent_id": 1,
        "avatar_id": null,
        "created_at": "2020-12-22T17:00:07.000000Z",
        "updated_at": "2020-12-22T17:00:07.000000Z"
    },
    {
        "id": 6,
        "name": "jazzzz",
        "pin": 12121212,
        "parent_id": 1,
        "avatar_id": null,
        "created_at": "2020-12-22T17:00:57.000000Z",
        "updated_at": "2020-12-22T17:00:57.000000Z"
    },
    {
        "id": 7,
        "name": "jazzzz",
        "pin": 12121212,
        "parent_id": 1,
        "avatar_id": null,
        "created_at": "2020-12-22T17:01:18.000000Z",
        "updated_at": "2020-12-22T17:01:18.000000Z"
    },
    {
        "id": 8,
        "name": "chi",
        "pin": 123123,
        "parent_id": 1,
        "avatar_id": null,
        "created_at": "2020-12-23T09:05:34.000000Z",
        "updated_at": "2020-12-23T09:05:34.000000Z"
    }
]

}

我的模型文件是

 class ChildModel {
  List<Data> data;

  ChildModel({this.data});

  ChildModel.fromJson(Map<String, dynamic> json) {
    if (json['data'] != null) {
      data = new List<Data>();
      json['data'].forEach((v) {
        data.add(new Data.fromJson(v));
      });
    }
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.data != null) {
      data['data'] = this.data.map((v) => v.toJson()).toList();
    }
    return data;
  }
}

class Data {
  int id;
  String name;
  int pin;
  int parentId;
  Null avatarId;
  String createdAt;
  String updatedAt;

  Data(
      {this.id,
      this.name,
      this.pin,
      this.parentId,
      this.avatarId,
      this.createdAt,
      this.updatedAt});

  Data.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    name = json['name'];
    pin = json['pin'];
    parentId = json['parent_id'];
    avatarId = json['avatar_id'];
    createdAt = json['created_at'];
    updatedAt = json['updated_at'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['id'] = this.id;
    data['name'] = this.name;
    data['pin'] = this.pin;
    data['parent_id'] = this.parentId;
    data['avatar_id'] = this.avatarId;
    data['created_at'] = this.createdAt;
    data['updated_at'] = this.updatedAt;
    return data;
  }
}

我想在 listview 中显示 parent_id 为 1 的所有孩子。 我不知道如何迅速实现这一目标。任何人的帮助将不胜感激。

【问题讨论】:

    标签: flutter dart rest flutter-http


    【解决方案1】:

    您应该首先使用 http 进行 api 调用。然后将 json 响应解析为模型类的列表。然后使用 ListView 或您喜欢的任何小部件来显示数据。

    var res = await http.get(API_URL)
    var json = jsonDecode(res.body)
    var data = json['data'].map((e)=>ChildModel.fromJson(e)).toList()
    

    documentation中有全面的解释如何在ListView中渲染数据。

    总的来说,您可以创建一个显示状态数据的有状态小部件。它应该从状态类的onCreated() 方法调用fetchData() 方法,然后如果挂载了小部件,则在加载数据后调用setState((){});。虽然这不是一个好的做法,但已经足够开始了。

    【讨论】:

    • 您好,先生,谢谢您的回复。我试过这个方法,但它显示。_TypeError(类型'_InternalLinkedHashMap'不是'List'类型的子类型)
    • @imran 该错误可能意味着 API 未返回数据字段中的列表,如问题所示。
    【解决方案2】:

    我已经通过更改模型类解决了这个问题

       ChildModel childModelFromJson(String str) =>
        ChildModel.fromJson(json.decode(str));
    
    List<ChildModel> childModelListFromJson(String str) => List<ChildModel>.from(
        json.decode(str)["data"].map((x) => ChildModel.fromJson(x)));
    
    String childModelToJson(ChildModel data) => json.encode(data.toJson());
    

    【讨论】:

      猜你喜欢
      • 2020-08-03
      • 2017-05-26
      • 2022-01-12
      • 2019-08-26
      • 2017-05-25
      • 2021-10-02
      • 2021-06-23
      • 1970-01-01
      • 2021-02-03
      相关资源
      最近更新 更多