在flutter中从rest api获取特定用户的数据

问题描述

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

这可能是端点的可能链接 https://example.com/api/child?email=[e-mail] 我的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,"created_at": "2020-12-22T13:30:35.000000Z","updated_at": "2020-12-22T13:30:35.000000Z"
    },{
        "id": 5,"name": "jazzzz","pin": 12121212,"created_at": "2020-12-22T17:00:07.000000Z","updated_at": "2020-12-22T17:00:07.000000Z"
    },{
        "id": 6,"created_at": "2020-12-22T17:00:57.000000Z","updated_at": "2020-12-22T17:00:57.000000Z"
    },{
        "id": 7,"created_at": "2020-12-22T17:01:18.000000Z","updated_at": "2020-12-22T17:01:18.000000Z"
    },{
        "id": 8,"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>();
    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;
  }
}

我想在列表视图中显示 parent_id 为 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 中呈现数据的全面说明。

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

,

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

   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());