Flutter : Can't get array json using dio to list of object

Question

I tried to load array json (array with no key) and fetch into list of object, here is my sample code :

My ApiCliet :

Future<List<OnBoardingModel>> fetchOnboarding() async {
    try {
      Response response = await dio.get("api/OnboardingItem");
      return OnBoardingModel.fromJson(response.data) as List;
    } catch (error, stacktrace) {
      throw Exception("Exception occured: $error stackTrace: $stacktrace");
    }
  }

My Object (generated using quicktype) :

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

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

class OnBoardingModel {
  OnBoardingModel({
    this.id,
    this.judul,
    this.deskripsi,
    this.urlGambar,
  });

  int id;
  String judul;
  String deskripsi;
  String urlGambar;

  factory OnBoardingModel.fromJson(Map<String, dynamic> json) => OnBoardingModel(
    id: json["id"],
    judul: json["judul"],
    deskripsi: json["deskripsi"],
    urlGambar: json["urlGambar"],
  );

  Map<String, dynamic> toJson() => {
    "id": id,
    "judul": judul,
    "deskripsi": deskripsi,
    "urlGambar": urlGambar,
  };
}

In the end i got an error shown : Exception: Exception occured: type 'List<dynamic>' is not a subtype of type 'Map<String, dynamic>' stackTrace: #0, refer to this line return OnBoardingModel.fromJson(response.data) as List;

Could you please help me to solve this case. I thank you

Update

My json format :

[
  {
    "id": 0,
    "judul": "string",
    "deskripsi": "string",
    "urlGambar": "string"
  }
]

score 36 · Accepted Answer · answered Jun 08 '20 at 02:14

36

Finally i got the answer, just replace the return using this :

return (response.data as List)
          .map((x) => OnBoardingModel.fromJson(x))
          .toList();

Complete code :

Future<List<OnBoardingModel>> fetchOnboarding() async {
    try {
      Response response = await dio.get("api/OnboardingItem");
      // if there is a key before array, use this : return (response.data['data'] as List).map((child)=> Children.fromJson(child)).toList();
      return (response.data as List)
          .map((x) => OnBoardingModel.fromJson(x))
          .toList();
    } catch (error, stacktrace) {
      throw Exception("Exception occured: $error stackTrace: $stacktrace");
    }
  }

Hope this answer helps other guests who new in flutter.

answered Jun 08 '20 at 02:14

Bali Codes

581
1
5
8

Suprb, Working perfect – jaspreet Singh Feb 01 '21 at 02:36
@BaliCode will you please help me . I am stuck in a problem of listing data in flutter . – Rahul Kushwaha Feb 01 '21 at 09:42
@jaspreetSingh will please help me . I am stuck in a problem of listing data in flutter. – Rahul Kushwaha Feb 01 '21 at 09:43
I am getting the json response correctely but unable to list them. – Rahul Kushwaha Feb 01 '21 at 09:45
@RahulKushwara : is there any error message appears? – Bali Codes Feb 02 '21 at 04:32
@RahulKushwaha Can u please show me your code and what response you're trying to parse? Thanks – jaspreet Singh Feb 05 '21 at 19:09
@Rahul : check the last paragraph of my question, i have attached the json that i tried to parse – Bali Codes Feb 06 '21 at 01:56
@BaliCodes My Json Format is like :{ "status": "ok", "totalResults": 8960, -"articles": [ -{ -"source": { "id": null, "name": "Moneycontrol" }, "author": null, "title": "String", "description": "String", "url": "String", "urlToImage": "String", "publishedAt": "sTRING", "content": "String" },]} – Rahul Kushwaha Feb 06 '21 at 05:43
@jaspreetSingh I am using NewsApi.org json api. to get the results and show in list view ...using Dio . I am getting fine using http but fails to get using dio. – Rahul Kushwaha Feb 06 '21 at 05:44
@RahulKushwaha can u please try with this code see below - return (response.data["articles"] as List) .map((x) => NewsResult.fromJson(x)).toList(); NewsResult is your model here. – jaspreet Singh Feb 06 '21 at 06:04

score 1 · Answer 2 · answered Jun 06 '20 at 06:40

import 'dart:convert';

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

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

class Welcome {
    Welcome({
        this.id,
        this.judul,
        this.deskripsi,
        this.urlGambar,
    });

    int id;
    String judul;
    String deskripsi;
    String urlGambar;

    factory Welcome.fromJson(Map<String, dynamic> json) => Welcome(
        id: json["id"],
        judul: json["judul"],
        deskripsi: json["deskripsi"],
        urlGambar: json["urlGambar"],
    );

    Map<String, dynamic> toJson() => {
        "id": id,
        "judul": judul,
        "deskripsi": deskripsi,
        "urlGambar": urlGambar,
    };
}

final welcome = welcomeFromJson(jsonString);

Still face this issue, sir. `Exception: Exception occured: type 'List' is not a subtype of type 'String' stackTrace: #0` — Bali Codes, Jun 06 '20 at 13:21

Flutter : Can't get array json using dio to list of object

2 Answers2