未处理的异常：键入“列表”<dynamic> ' 不是 'SubJsonModel' 类型的子类型 - flutter</dynamic>

Question

Am trying to get a data from a json url but i get the error

Unhandled Exception: type 'List' is not a subtype of type 'SubJsonModel'

main.dart

final String url = 'https://raw.githubusercontent.com/BrightCode1/ohms-json/master/categories.json';
List<JsonModel> myModel = [];

@override
  void initState() {
    // TODO: implement initState
    super.initState();
    loadData();
  }

  loadData() async {
  var res = await http.get(url, headers: {"Accept":"application/json"});
  if(res.statusCode == 200) {
    String resBody = res.body;
    var jsonDecode = json.decode(resBody);
    for(var data in jsonDecode) {
      myModel.add(JsonModel(data['cat_id'], data['category'], data['cat_subcategory']));
      setState(() {});
    }
      print(myModel[1].subCat.name);
  }else {
    print("Something went wrong!");
  }
  }

model.dart

class JsonModel {
  final String id;
  final String category;
  SubJsonModel subCat;

  JsonModel(this.id, this.category, this.subCat);
}

class SubJsonModel {
  final String name;
  final String image;

  SubJsonModel(this.name, this.image);
}

please how do i solve this

Answer 1

You can use https://app.quicktype.io/ to create the model.dart from a json.

To parse this JSON data, do final pieSingleChartInfo = pieSingleChartInfoFromJson(jsonString);

import 'dart:convert';

List<PieSingleChartInfo> pieSingleChartInfoFromJson(String str) => List<PieSingleChartInfo>.from(json.decode(str).map((x) => PieSingleChartInfo.fromJson(x)));

String pieSingleChartInfoToJson(List<PieSingleChartInfo> data) => json.encode(List<dynamic>.from(data.map((x) => x.toJson())));

class PieSingleChartInfo {
    PieSingleChartInfo({
        this.category,
        this.catId,
        this.catIcon,
        this.catSubcategory,
    });

    String category;
    String catId;
    String catIcon;
    List<CatSubcategory> catSubcategory;

    factory PieSingleChartInfo.fromJson(Map<String, dynamic> json) => PieSingleChartInfo(
        category: json["category"],
        catId: json["cat_id"],
        catIcon: json["cat_icon"] == null ? null : json["cat_icon"],
        catSubcategory: List<CatSubcategory>.from(json["cat_subcategory"].map((x) => CatSubcategory.fromJson(x))),
    );

    Map<String, dynamic> toJson() => {
        "category": category,
        "cat_id": catId,
        "cat_icon": catIcon == null ? null : catIcon,
        "cat_subcategory": List<dynamic>.from(catSubcategory.map((x) => x.toJson())),
    };
}

class CatSubcategory {
    CatSubcategory({
        this.subName,
        this.subImage,
    });

    String subName;
    String subImage;

    factory CatSubcategory.fromJson(Map<String, dynamic> json) => CatSubcategory(
        subName: json["sub_name"],
        subImage: json["sub_image"],
    );

    Map<String, dynamic> toJson() => {
        "sub_name": subName,
        "sub_image": subImage,
    };
}

Answer 2

I noted a few issues and corrected them based on the information you provided. Read the comments. Add a sample response body to the question.

final String url =
    'https://raw.githubusercontent.com/BrightCode1/ohms-json/master/categories.json';
List<JsonModel> myModel = [];

@override
void initState() {
  // TODO: implement initState
  super.initState();
  loadData();
}

loadData() async {
  var res = await http.get(url, headers: {"Accept": "application/json"});
  if (res.statusCode == 200) {
    String resBody = res.body;
    var jsonDecode = json.decode(resBody);
    for (var data in jsonDecode) {
      // first create SubJsonModel object
      var subCat = SubJsonModel(
          data['cat_subcategory']['name'], data['cat_subcategory']['image']);
      //use subCat to create JsonModel
      myModel.add(JsonModel(data['cat_id'], data['category'], subCat));
      setState(() {});
    }
    print(myModel[1].subCat.name);
  } else {
    print("Something went wrong!");
  }
}

Answer 3

So here what I do first create a model class with the help of this online tool . And then changed code like first save subcategory in one list and then passed it to the main list and then print

Here is my loadData() method

final String url = 'https://raw.githubusercontent.com/BrightCode1/ohms-json/master/categories.json'; List myModel = [];

  loadData() async {
    var res = await http.get(url, headers: {"Accept": "application/json"});
    if (res.statusCode == 200) {
      String resBody = res.body;
      var jsonDecode = json.decode(resBody);
      for (var data in jsonDecode) {


        List<CatSubcategory> subCate = [];   // Set a emoty list of CatSubcategory
         data['cat_subcategory'].map((x) {  // Here parsed the cat_subcategory data and simply add it into list
          return subCate.add(
              CatSubcategory(subName: x['sub_name'], subImage: x['sub_image']));
        }).toList();  // and this done for we get map data so convert this data toList();


        myModel.add(JsonModel(
            category: data['category'],
            catId: data['cat_id'],
            catIcon: data['cat_icon'],
            catSubcategory: subCate));
        setState(() {});
      }
      print(myModel[0].catSubcategory[0].subName);
    } else {
      print("Something went wrong!");
    }
  }

here is my model class

class JsonModel {
  JsonModel({
    this.category,
    this.catId,
    this.catIcon,
    this.catSubcategory,
  });

  String category;
  String catId;
  String catIcon;
  List<CatSubcategory> catSubcategory;

  factory JsonModel.fromJson(Map<String, dynamic> json) => JsonModel(
        category: json["category"],
        catId: json["cat_id"],
        catIcon: json["cat_icon"],
        catSubcategory: List<CatSubcategory>.from(
            json["cat_subcategory"].map((x) => CatSubcategory.fromJson(x))),
      );

  Map<String, dynamic> toJson() => {
        "category": category,
        "cat_id": catId,
        "cat_icon": catIcon,
        "cat_subcategory":
            List<dynamic>.from(catSubcategory.map((x) => x.toJson())),
      };
}

class CatSubcategory {
  CatSubcategory({
    this.subName,
    this.subImage,
  });

  String subName;
  String subImage;

  factory CatSubcategory.fromJson(Map<String, dynamic> json) => CatSubcategory(
        subName: json["sub_name"],
        subImage: json["sub_image"],
      );

  Map<String, dynamic> toJson() => {
        "sub_name": subName,
        "sub_image": subImage,
      };
}