title: Flutter: Can't fetch json API data
body: <p>I am trying to fetch data from a json API to my flutter mobile application. But I failed.</p>
  <p>I think I have a problem in my <code>model.dart</code> file.</p>
  <p>Here is my code for <code>model.dart</code></p>
  <pre><code>import 'dart:async';
  import 'dart:convert';
  import 'package:flutter/foundation.dart';
  import 'package:http/http.dart' as http;
  
  Future&lt;List&lt;Book&gt;&gt; fetchBooks(http.Client client) async {
    final response =
        await client.get('https://boimarket.abirahsan.com/public/api/v1/books');
  
    // Use the compute function to run parsePhotos in a separate isolate.
    return compute(parseBooks, response.body);
  }
  
  // A function that converts a response body into a List&lt;Photo&gt;.
  List&lt;Book&gt; parseBooks(String responseBody) {
    final parsed = jsonDecode(responseBody).cast&lt;Map&lt;String, dynamic&gt;&gt;();
  
    return parsed.map&lt;Book&gt;((json) =&gt; Book.fromJson(json)).toList();
  }
  
  class Book {
    final String name;
    final String author;
    final String genreClass;
    final String imgUrl;
    final String pdf;
    final int category;
  
    Book({
      this.name,
      this.author,
      this.genreClass,
      this.imgUrl,
      this.pdf,
      this.category,
    });
  
    factory Book.fromJson(Map&lt;String, dynamic&gt; json) {
      return Book(
        name: json['name'] as String,
        imgUrl: json['image'] as String,
        pdf: json['pdf'] as String,
        author: json['author'] as String,
        genreClass: json['genre_class'] as String,
        category: json['category'] as int,
      );
    }
  }
  </code></pre>
  <p>and here is my output Image</p>
  <p><a href="https://i.stack.imgur.com/Fz8Y3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Fz8Y3.png" alt="enter image description here" /></a></p>
  <p>Where is the problem ? And How can I fix it?</p>