关于 Flutter Firestore Rest Api Json 输出

Question

{
    "documents": [
        {
            "name": "projects/xxxxx/databases/(default)/documents/blogs/Hao5IboeA6b7ySlmx0qN",
            "fields": {
                "imgUrl": {
                    "stringValue": "https://firebasestorage.googleapis.com/v0/b/xxxxxx/o/blogImages%2F72H566888.jpg?alt=media&token=75b75deb-69a3-4019-a82e-335a2d72b52e"
                },
                "authorName": {
                    "stringValue": "iki"
                },
                "title": {
                    "stringValue": "dd"
                },
                "desc": {
                    "stringValue": "ee"
                }
            },
            "createTime": "2020-10-31T08:57:46.799862Z",
            "updateTime": "2020-10-31T08:57:46.799862Z"
        },
    ]
}

我正在使用 Firebase Firestore Rest Api。我有上面的 json 格式的输出。我使用 Json 来创建我的模型。我的模型如下。

class Model {
  List<Documents> documents;

  Model({this.documents});

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

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

class Documents {
  String name;
  Fields fields;
  String createTime;
  String updateTime;

  Documents({this.name, this.fields, this.createTime, this.updateTime});

  Documents.fromJson(Map<String, dynamic> json) {
    name = json['name'];
    fields =
        json['fields'] != null ? new Fields.fromJson(json['fields']) : null;
    createTime = json['createTime'];
    updateTime = json['updateTime'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['name'] = this.name;
    if (this.fields != null) {
      data['fields'] = this.fields.toJson();
    }
    data['createTime'] = this.createTime;
    data['updateTime'] = this.updateTime;
    return data;
  }
}
......

return jsonModel.map((item) => model.fromJson(item)).toList(); 我返回了它，但在 FutureBuilder 中它是 snapshot.data[index].documents .

如何访问 imgUrl、authorName、title、desc 字段？我对这种混合 json 输出有困难。你能帮帮我吗？

Answer 1

你可以做一个嵌套结构的listView，并且你可以访问字段模型。

第一种方式：

 return FutureBuilder<List<Document>>(
  future: getDocuments(),
  builder: (BuildContext context, AsyncSnapshot<List<Document>> snapshot) {
    if (snapshot.hasData) {
      return ListView.builder(
        itemCount: snapshot.data.length,
        shrinkWrap: true,
        itemBuilder: (context, index) {
          return buildListView(snapshot.data[index].documents);
        },
      );
    } else {
      return Text("error");
    }
  },
);

然后你做子内部方法然后绘制。

 ListView buildListView(List<Documents> documents) {
return ListView.builder(
  itemCount: documents.length,
  itemBuilder: (context, index) => ListTile(
    title: Text(documents[index].name),
    leading: Text(documents[index].fields.imgUrl.stringValue),
    subtitle: Text(documents[index].fields.desc.stringValue),
  ),
);

2.您可以通过列表扩展功能将列表转换为列表模型。

  Future<List<Document>> getDocuments() async {
await Future.delayed(Duration(seconds: 100));
return dummyItems;
  }

  Future<List<Documents>> getFieldsOnly() async {
final response = await getDocuments();
return response.expand((f) => f.documents).toList();
  }

现在，一切都完成了。你可以look at this repo了解更多详情(lib/fire-store-document)