I have the following json that I am trying to fetch from my backend api. However I am facing this error Unhandled Exception: type 'List<dynamic>' is not a subtype of type 'List<Media>' and not sure how to fix it. Also I am not sure how to set up the tags properly, should it be a factory as well, because what I added there I generated from web but I think its not good approach

Model:

class Item {
  bool completed;
  String id;
  List<Media> media;
  double? user_rating;
  List<Tags>? tags;
 
  Item(
      {required this.completed,
      required this.id,
      required this.media,
        this.user_rating,
      this.tags
      });

  factory Item.fromJson(Map<String, dynamic> json) {
    return Item(
        completed: json['completed'],
        id: json['id'],
        media: json['media'].map((item) => Media.fromJson(item)).toList(),
        user_rating: json['user_rating'],
        tags: json['tags'],
  }
}

class Tags {
   List<String>? tags;

   Tags({this.tags});

   Tags.fromJson(Map<String, dynamic> json){
     tags = List.castFrom<dynamic, String>(json['tags']);
   }
}

class Media {
  String id;
  String url;

  Media({required this.id, required this.url});

  factory Media.fromJson(Map<String, dynamic> json) {
    return Media(id: json['id'], url: json['url']);
  }
}

JSON:

{
  "collection": [
        {
            "completed": false,
            "id": "d61484f7-9179-42ee-a3f1-72949d7e08b3",
            "media": [
                {
                    "description": null,
                    "id": "ae488c57-954b-4f83-8cbb-39b259bb18d1",
                    "mime": "image/png",
                    "name": "unknown (7).png",
                    "size": 573404,
                    "url": "test"
                }
            ],
            "tags": [
                "tag2",
                "tag5",
                "tag9"
            ],
            "user_rating": null
        }
    ],
}

CodePudding user response：

This is happening because in your model you have declared media list with type of Media like

List<Media> media;

which means it can only contain Media object as it's items but you are passing a Map object to it when calling your API like :

[
                {
                    "description": null,
                    "id": "ae488c57-954b-4f83-8cbb-39b259bb18d1",
                    "mime": "image/png",
                    "name": "unknown (7).png",
                    "size": 573404,
                    "url": "test"
                }
            ]

Solution

Change this :

List<Media> media;

to

List<dynamic> media; or List<Map<String, dynamic>> media;

CodePudding user response：

You use this model

class Item {
      bool completed;
      String id;
      List<Media> media;
      double? user_rating;
      List<Tags>? tags;
    
      Item(
          {required this.completed,
          required this.id,
          required this.media,
          this.user_rating,
          this.tags});
    
      factory Item.fromJson(Map<String, dynamic> json) {
        id = json['id'];
        completed = json['completed'];
        user_rating = json['user_rating'];
        tags = json['tags'];
    
        if (json['media'] != null) {
          media = <Media>[];
          json['media'].forEach((v) {
            media.add(Media.fromJson(v));
          });
        }
      }
    }
    
    class Tags {
      List<String>? tags;
    
      Tags({this.tags});
    
      Tags.fromJson(Map<String, dynamic> json) {
        tags = List.castFrom<dynamic, String>(json['tags']);
      }
    }
    
    class Media {
      String id;
      String url;
    
      Media({required this.id, required this.url});
    
      factory Media.fromJson(Map<String, dynamic> json) {
        return Media(id: json['id'], url: json['url']);
      }
    }