How to go on about receiving JSON array in flutter and parsing it?

Question

I am trying to get a JSON array from a webservice URL and parse it in JSON. The thing is the tutorial I was following shows receving one JSOn obj and parsing it but I need to know how to receive a JSON array and parse it. Below is the code I am working on, I am stuck.

Model

class Fact {
  int id;
  int fact_id;
  String fact;
  String image;
  String reference;

  Fact(this.id, this.fact_id, this.fact, this.image, this.reference);

  Fact.fromJson(Map<String, dynamic> json)
    : id = json['id'],
      fact_id = json['fact_id'],
      fact = json['fact'],
      image = json['image'],
      reference = json['reference'];

    Map<String, dynamic> toJson() =>
    {
      'id' : id,
      'fact_id': fact_id,
      'fact': fact,
      'image': image,
      'reference': reference,
    };
}

I don't get how to write this for the array of facts which I am getting from the webservice.

Fact Download Manager

class FactsManager {
  var constants = Constants();

  fetchFacts() {
    final lastFactId = 0;
    var fetchRequestUrl = constants.fetch_facts_url;

    if (lastFactId == 0) {
      fetchRequestUrl = fetchRequestUrl + "?count=" + constants.firstTimePostCount.toString();
    } else {
      fetchRequestUrl = fetchRequestUrl + "?count=" + constants.firstTimePostCount.toString() + "&last_id=" + lastFactId.toString();
    }
    Future<List<Fact>> fetchPost() async {
      final response = await http.get(fetchRequestUrl);

      if (response.statusCode == 200) {
        return List<Fact>
      }
    }
  }
}

Example Data which I am trying to parse.

[
    {
        "id": "407",
        "fact": "Monsanto once tried to genetically engineer blue cotton, to produce denim without the use of dyes, reducing the pollution involved in the dyeing process.   ",
        "reference": null,
        "image": "http:\/\/quickfacts.me\/wp-content\/uploads\/2015\/06\/fact492.png",
        "fact_id": "1"
    },
    {
        "id": "560",
        "fact": "You can count from zero to nine hundred ninety-nine without ever having to use the letter \"a\"   ",
        "reference": null,
        "image": "http:\/\/quickfacts.me\/wp-content\/uploads\/2015\/06\/fact04.png",
        "fact_id": "2"
    },
    {
        "id": "564",
        "fact": "In order to keep the project a secret, the British army used the innocuous name \"mobile water carriers\" for a motorized weapons project - which is the reason we call them \"tanks\".   ",
        "reference": null,
        "image": "http:\/\/quickfacts.me\/wp-content\/uploads\/2015\/06\/fact116.png",
        "fact_id": "3"
    },
    {
        "id": "562",
        "fact": "In 2010 the mummified corpse of Sogen Kato, thought to be Tokyo's oldest man, was found in his bedroom by government officials. He had actually died in 1978.   ",
        "reference": null,
        "image": "http:\/\/quickfacts.me\/wp-content\/uploads\/2015\/06\/fact216.png",
        "fact_id": "4"
    },
    {
        "id": "566",
        "fact": "In 1927 the US Supreme Court ruled it constitutional for the government to forcefully sterilize mentally handicapped people   ",
        "reference": null,
        "image": "http:\/\/quickfacts.me\/wp-content\/uploads\/2015\/06\/fact316.png",
        "fact_id": "5"
    }
]

Answer 1

You can do the following:

String receivedJson = "... Your JSON string ....";
List<dynamic> list = json.decode(receivedJson);
Fact fact = Fact.fromJson(list[0]);

In any case, you must consider the following in your json string and the Fact class that you have crafted:

• In the json string the id and fact_id are Strings and you treat them as int. Either you change the json or the Fact class
• Some strings inside the json string produce errors as the have additional quotation marks and this confuses the decoder.

A json string the works is the following:

String receivedJson = """
[
    {
        "id": 407,
        "fact": "Monsanto once tried to genetically engineer blue cotton, to produce denim without the use of dyes, reducing the pollution involved in the dyeing process.   ",
        "reference": null,
        "image": "http:\/\/quickfacts.me\/wp-content\/uploads\/2015\/06\/fact492.png",
        "fact_id": 1
    }
]
    """;

Answer 2

Easily

      String arrayText = '[{"name": "dart1","quantity": 12 },{"name": "flutter2","quantity": 25 }]';

      var tagsJson = jsonDecode(arrayText);
      List<dynamic> tags = tagsJson != null ? List.from(tagsJson) : null;

      print(">> " + tags[0]["name"]);
      print(">> " + tags[1]["name"]);
      print(">> " + tags[0]["quantity"].toString());
      print(">> " + tags[1]["quantity"].toString());

output

2021-04-28 18:55:28.921 22085-22225/com.example.flutter_applicationdemo08 I/flutter: >> dart1
2021-04-28 18:55:28.921 22085-22225/com.example.flutter_applicationdemo08 I/flutter: >> flutter2
2021-04-28 18:55:28.921 22085-22225/com.example.flutter_applicationdemo08 I/flutter: >> 12
2021-04-28 18:55:28.921 22085-22225/com.example.flutter_applicationdemo08 I/flutter: >> 25