未处理的异常：从 jsonplaceholder.typecode.com/photos 获取 Json 时，类型“List<dynamic>”不是“Map<String, dyna

Posted 2023-02-23

【中文标题】未处理的异常：从 jsonplaceholder.typecode.com/photos 获取 Json 时，类型“List<dynamic>”不是“Map<String, dynamic>”类型的子类型

【英文标题】：Unhandled Exception: type 'List<dynamic>' is not a subtype of type 'Map<String, dynamic>' While fetching Json from jsonplaceholder.typecode.com/photos

【发布时间】：2021-07-24 11:30:33

【问题描述】：

我正在尝试从 https://jsonplaceholder.typicode.com/photos/ 获取 JSON，但出现类似 Unhandled Exception: type 'List' is not a subtype of type 'Map' 之类的错误。我还是个学习狂。

有什么解决办法吗？

这是我的代码。

main.dart

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' show get;
import 'src/widgets/image_list.dart';
import 'src/models/imageloader.dart';

void main() 
  runApp(App());


class App extends StatelessWidget 
  Widget build(BuildContext context) 
    return MaterialApp(
      title: "app",
      theme: ThemeData(primarySwatch: Colors.blue),
      home: homePage(),
    );
  


class homePage extends StatefulWidget 
  @override
  _homePageState createState() => _homePageState();


class _homePageState extends State<homePage> 
  int counter = 0;
  List<ImageLoader> images = [];
  void loadImage() async 
    counter++;
    var response =
        await get(Uri.parse('https://jsonplaceholder.typicode.com/photos/'));
    var imageModel = ImageLoader.fromJson(jsonDecode(response.body));
    /*  var imagemodel = imageModel.map((i) => ImageLoader.fromJson(i)).toList(); */
    setState(() 
      images.add(imageModel);
    );
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(
        title: Text("Let's load some images"),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: loadImage,
        child: Icon(Icons.add),
      ),
      body: ImageList(images),
    );
  

imageLoager.dart

class ImageLoader 
  int id = 0;
  String url = "";
  String title = "";

  ImageLoader(this.id, this.url, this.title);

  ImageLoader.fromJson(Map<String, dynamic> parsedJson) 
    id = parsedJson['id'];
    url = parsedJson['url'];
    title = parsedJson['title'];
  

image_list.dart

import 'package:flutter/material.dart';
import '../models/imageloader.dart';

class ImageList extends StatelessWidget 
  final List<ImageLoader> images;
  ImageList(
    this.images,
  );

  Widget build(BuildContext context) 
    return ListView.builder(
      itemCount: images.length,
      itemBuilder: (context, int index) 
        return Text(images[index].url);
      ,
    );
  

调试控制台：

未处理的异常：“List”类型不是“Map”类型的子类型 E/颤振（4984）：#0 _homePageState.loadImage 包：imageloader/main.dart:33 电子/颤振（4984）： E/颤动​​（4984）：

【问题讨论】：

您的问题解决了吗？

【参考方案1】：

您的响应出现在一个列表中，其中包含您想要的地图。 在您的 var response 行下使用它，它应该可以工作：

List<ImageLoader> _images = [];
var decodedResponse = jsonDecode(response.body);

for (var item in decodedResponse) 
_images.add(ImageLoader.fromJson(item));


setState(() 
      images= _images;
    );