如何从 Flutter 中的 api 获取 List<string> 的对应值？答案

【问题标题】：how to get corresponded value of a List<string> from api in flutter?如何从 Flutter 中的 api 获取 List<string> 的对应值？
【发布时间】：2020-08-05 06:30:50
【问题描述】：

这是我的 API 响应

var = ''' [
{
    "entity_id": "86",
    "building_name": "Burj Khalifa",
    "location": "Al  Ttay",
    "image_field": "1595916594oad.jpeg"
},
{
    "entity_id": "87",
    "building_name": "Azmair",
    "location": " Eyal Nasser ",
    "image_field": "1596541099s.jpeg"
},
  {
    "entity_id": "88",
    "building_name": "Bella Casa",
    "location": "Hatta",
    "image_field": "15965463423abe68a5bc11733effefeb91194_767x0.jpg"
  }
]''';

我正在使用它作为字符串

var decoded = response as List;
var buildgnames = decoded.map<String>((e) => e['building_name']).toList();

在列表中选择建筑物名称时如何获取“entity_id”？

当我在下拉列表中选择“哈利法塔”时，我想获取它的“id”

【问题讨论】：

标签： android ios flutter dart flutter-layout

【解决方案1】：

这里是关于 json 和序列化如何在 Flutter 中工作的一个很好的指南： https://flutter.dev/docs/development/data-and-backend/json

基本上你为你的数据结构创建一个模型：

class Entity {
   int entityId;
   String buildingName;
   String location;
   String imageField;

   Entity({this.entityId, this.buildingName, this.location, this.imageField});

   Entity.fromJson(Map<String, dynamic> json) : 
     entityId = json["entity_id"],
     buildingName = json["building_name"],
     location = json["location"],
     imageField = json["imageField"];
}

完成后，您可以像这样使用 dart:convert 包反序列化您的 json：

var jsonMap = jsonDecode(jsonString);
var entity = Entity.fromJson(jsonMap);

在此之后，您可以将您的实体作为要在下拉列表中选择的数据。当您选择“哈利法塔”时。您可以简单地检查 entity.id

【讨论】：

【解决方案2】：

 DropdownButtonFormField(
      hint: Text("Building"),
      onChanged: ((val) {
        setState((){
        print(val. entity_id);
        selectedBuilding = val;
        });
      }),
      value: selectedBuilding ?? null,
      items: buildingList.map<DropdownMenuItem>((BuildingModel value) {
        return DropdownMenuItem(
          value: value,
          child: Text(value.building_name),
        );
      }).toList(),
      decoration: InputDecoration(
        icon: Icon(Icons.access_time)
      ),
    );

你可以得到你选择的建筑模型：

onChanged: ((val) {
            setState((){
          print(val. entity_id);
          selectedBuilding = val;
          });
          }),

【讨论】：

【解决方案3】：

您可以使用foreach 访问列表中的每个元素，例如

decoded.forEach((element) { 
  var entity_id = element['entity_id'];
})

在您的情况下，当您选择下拉按钮时，您将获得项目的索引，使用该索引并像这样获取它

var entity_id = decoded.elementAt(index)['entity_id'];

【讨论】：

这将是一个糟糕的解决方案，它不是真正可扩展的。他应该简单地更改为谷歌建议的反序列化方式：flutter.dev/docs/development/data-and-backend/json
他已经完成了解码工作，现在他有List<dynamic> 我只是告诉他如何访问该列表对象中的 entity_id

【解决方案4】：

首先你必须创建模型类。

 class Building {
  String id;
  String buildingName;
  String location;
  String imageField;

  Building({this.id, this.buildingName, this.location, this.imageField});

  Building.fromJson(Map<String, dynamic> json) {
    id = json['entity_id'];
    buildingName = json['building_name'];
    location = json['location'];
    imageField = json['image_field'];
  }
}

之后将响应转换为 Building 对象。

 Iterable mJson = json.decode(response.body);
 List<Building> buildingList = mJson.map((model) => Building.fromJson(model)).toList();

点击时显示建筑列表名称并返回建筑ID。

Expanded(
        child: ListView.separated(
            separatorBuilder: (context, index) => Divider(
                  color: Colors.grey,
                ),
            itemCount: buildings?.length ?? 0,
            itemBuilder: (BuildContext ctxt, int index) {  
              return InkWell(
                  onTap: () => _handleRowTap(buildings[index].id),
                  child: Padding(
                    padding: EdgeInsets.all(8),
                    child: Text(
                          "${buildings[index].buildingName}",
                        ),
                  ));
            }));

还有最新的。

_handleRowTap(String buildingId) {
//Handle click event here
  }

【讨论】：