Flutter(Dart) - 如何从列表中的列表中读取？答案

【问题标题】：Flutter(Dart) - How to read from a list in a list?Flutter(Dart) - 如何从列表中的列表中读取？
【发布时间】：2021-11-23 14:32:30
【问题描述】：

所以我有这种格式的数据：

List users = [
  {
   "id": "p1",
   "name": "John Doe",
   "age": "44",
   "imageUrl": [
   {
    "assets/images/anastasia-vityukova-unsplash-blackandwhiteimage.png",
    "assets/images/anastasia-vityukova-unsplash.png",
  }
 ],
 "profession": "Financial Consultant"
 },

{
 "id": "p2",
 "name": "John Doe2",
 "age": "42",
 "imageUrl": [
  {
    "assets/images/good-faces-hiba-unsplash-blackandwhiteimage.png",
    "assets/images/good-faces-hiba-unsplash.jpg",
  }
 ],
 "profession": "Financial Consultant"
 },
];

如何阅读 imageUrls？

            decoration: BoxDecoration(
          image: DecorationImage(
              image: AssetImage(lstUsers[index]["imageUrl"][0]),
              fit: BoxFit.cover),
        ),

【问题讨论】：

尝试使用List<Map<String,String>>而不是List

标签： json list flutter dart

【解决方案1】：

正如错误所说，Dart 将该字段视为 Set {} 或更具体地视为 LinkedHashSet。集合没有实现 [] 运算符，但您可以使用方法 elementAt 访问其元素。

lstUsers[0]["imageUrl"][0].elementAt(1)

在lstUsers[0]["imageUrl"][0] 之前，您已经选择了数组中的第一个元素，但请注意，该数组不仅由字符串组成，还是一个包含字符串的集合。

[{    "assets/images/anastasia-vityukova-unsplash-blackandwhiteimage.png",
    "assets/images/anastasia-vityukova-unsplash.png",  }]

这就是你必须使用.elementAt() 来访问字符串的原因。如果您有能力在字符串周围放下{}，我会建议您这样做，这样它们就更容易访问了。或者甚至更好地创建管理 JSON 的序列化和反序列化的类。一个不错的起点是quicktype。

【讨论】：

【解决方案2】：

可以看到 imageUrl 数组的结构是这样的：

"imageUrl": [
  {
    "assets/images/good-faces-hiba-unsplash-blackandwhiteimage.png",
    "assets/images/good-faces-hiba-unsplash.jpg",
  }
],

imageUrl 数组中的第一项不是 String 而是 Set（因为它被花括号包围）。如果您想访问 imageUrl 列表中的第一个资源，请删除花括号并使 imageUrl 看起来像这样：

"imageUrl": [
    "assets/images/good-faces-hiba-unsplash-blackandwhiteimage.png",
    "assets/images/good-faces-hiba-unsplash.jpg",
],


// Now when you use that it will return a String
lstUsers[index]["imageUrl"][0];

如果您想保持列表的结构相同并且仍想访问第一个 imageUrl，您可以使用以下语法：

lstUsers[index]["imageUrl"][0].first;

【讨论】：