List listDta = [
    {
      "title": 'Candy Shop',
      "author": 'Mohamed Chahin',
      "imageUrl": 'https://www.itying.com/images/flutter/1.png',
    },
    {
      "title": 'Childhood',
      "author": 'Google',
      "imageUrl": 'https://www.itying.com/images/flutter/2.png',
    },
    {
      "title": 'Alibaba Shop',
      "author": 'Alibaba',
      "imageUrl": 'https://www.itying.com/images/flutter/3.png',
    },
    {
      "title": 'Candy Shop',
      "author": 'Mohamed Chahin',
      "imageUrl": 'https://www.itying.com/images/flutter/4.png',
    },
    {
      "title": 'Tornado',
      "author": 'Mohamed Chahin',
      "imageUrl": 'https://www.itying.com/images/flutter/5.png',
    },
    {
      "title": 'white-dragon',
      "author": 'Mohamed Chahin',
      "imageUrl": 'https://www.itying.com/images/flutter/7.png',
    }
  ];

// 我想要把所有的imageUrl都单独拿出来,成为一个list
  Navigator.pushNamed(
            context,
            "/hero",
            arguments: {
              'imageUrl': value['imageUrl'],
              'imageUrlList': listDta.map((e) => e['imageUrl']).toList(),
            },
          );
// 另一个页面中
// 如果你认为是String类型,这里其实会报错,应该是dynamic类型
late List<String> imageUrlList = [];

  
  void initState() {
    imageUrlList = widget.arguments['imageUrlList'];
    super.initState();
  }

疑问:listDta.map((e) => e[‘imageUrl’]).toList()这里处理后不是List类型的参数吗,具体是什么样的?

代码分析

listDta.map((e) => e['imageUrl']).toList()

类型分析:

  1. 原始数据结构
List listDta = [
  {
    "title": 'Candy Shop',
    "author": 'Mohamed Chahin',
    "imageUrl": 'https://www.itying.com/images/flutter/1.png', // String类型
  },
  // ... 其他项
];
  1. map操作后的类型
Iterable<dynamic> → map操作返回Iterable<dynamic>
  1. toList()后的类型
List<dynamic>toList()转换为List<dynamic>

实际结果:

这段代码执行后得到的是 List<dynamic> 类型,其中包含:

[
  'https://www.itying.com/images/flutter/1.png',
  'https://www.itying.com/images/flutter/2.png',
  'https://www.itying.com/images/flutter/3.png',
  // ... 其他图片URL
]

更精确的类型声明:

如果你想获得明确的 List<String> 类型,应该这样写:

// 方法1:类型转换
List<String> imageUrls = listDta.map((e) => e['imageUrl'] as String).toList();

// 方法2:指定泛型
List<String> imageUrls = listDta.map<String>((e) => e['imageUrl']).toList();

// 方法3:使用cast(最安全)
List<String> imageUrls = listDta.map((e) => e['imageUrl']).cast<String>().toList();

在代码中的实际应用:

List<Widget> _getListData() {
  // 这里实际上是 List<dynamic> 类型
  var tempList = listDta.map((value) {
    return GestureDetector(
      onTap: () {
        Navigator.pushNamed(
          context,
          "/hero",
          arguments: {'imageUrl': value['imageUrl']}, // 这里取的是String值
        );
      },
      // ... 其他代码
    );
  });
  return tempList.toList(); // 返回 List<Widget>
}

所以你看到的 listDta.map((e) => e['imageUrl']).toList() 确实会产生一个包含字符串URL的列表,但由于Dart的类型推断,它被识别为 List<dynamic> 而不是 List<String>

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐