title: Type error while fetching data from API while using Future builder
body: <p>I have this error:</p>
  <blockquote>
  <p>_TypeError (type '_InternalLinkedHashMap&lt;String, dynamic&gt;' is not a subtype of type 'List')</p>
  </blockquote>
  <p><strong>This is my HTTP method class:</strong></p>
  <pre><code>List&lt;Property&gt;? areaview;
  Future&lt;void&gt; fetcharea() async {
    final response = await http.get(
        Uri.parse('https://arz-e-nafees.nafeessolutions.com/public/api/view'));
    if (response.statusCode == 200) {
      var property = (json.decode(response.body));
      Areaview viewarea = Areaview.fromJson(property);
      areaview = viewarea.properties;
      return property;
    } else {
      throw Exception('Unexpected error occured!');
    }
  }
  </code></pre>
  <p><strong>This is my model class:</strong></p>
  <pre><code>// To parse this JSON data, do
  //
  //     final areaview = areaviewFromJson(jsonString);
  
  import 'dart:convert';
  
  Areaview areaviewFromJson(String str) =&gt; Areaview.fromJson(json.decode(str));
  
  String areaviewToJson(Areaview data) =&gt; json.encode(data.toJson());
  
  class Areaview {
    Areaview({
      required this.properties,
    });
  
    List&lt;Property&gt; properties;
  
    factory Areaview.fromJson(Map&lt;String, dynamic&gt; json) =&gt; Areaview(
          properties: List&lt;Property&gt;.from(
              json[&quot;properties&quot;].map((x) =&gt; Property.fromJson(x))),
        );
  
    Map&lt;String, dynamic&gt; toJson() =&gt; {
          &quot;properties&quot;: List&lt;dynamic&gt;.from(properties.map((x) =&gt; x.toJson())),
        };
  }
  
  class Property {
    Property({
      required this.propertyImage,
      required this.propertyTitle,
      required this.locationCity,
      required this.locationArea,
      required this.propertyDescription,
      required this.propertyPrice,
    });
  
    String? propertyImage;
    String propertyTitle;
    String locationCity;
    String locationArea;
    String propertyDescription;
    String propertyPrice;
  
    factory Property.fromJson(Map&lt;String, dynamic&gt; json) =&gt; Property(
          propertyImage:
              json[&quot;property_image&quot;] == null ? null : json[&quot;property_image&quot;],
          propertyTitle: json[&quot;property_title&quot;],
          locationCity: json[&quot;location_city&quot;],
          locationArea: json[&quot;location_area&quot;],
          propertyDescription: json[&quot;property_description&quot;],
          propertyPrice: json[&quot;property_price&quot;],
        );
  
    Map&lt;String, dynamic&gt; toJson() =&gt; {
          &quot;property_image&quot;: propertyImage == null ? null : propertyImage,
          &quot;property_title&quot;: propertyTitle,
          &quot;location_city&quot;: locationCity,
          &quot;location_area&quot;: locationArea,
          &quot;property_description&quot;: propertyDescription,
          &quot;property_price&quot;: propertyPrice,
        };
  }
  </code></pre>
  <p><strong>And this is my future builder:</strong></p>
  <pre><code>FutureBuilder(
                future: fetcharea(),
                builder: (context, AsyncSnapshot snapshot) {
                  if (!snapshot.hasData) {
                    return Center(child: CircularProgressIndicator());
                  } else {
                    return VerticalCards(snapshot.data);
                  }
                },
              ),
  </code></pre>
  <p><strong>Here is a screenshot of the exception</strong>
  <a href="https://i.stack.imgur.com/bEyWc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/bEyWc.png" alt="enter image description here" /></a></p>
  <p><strong>Data type I am getting after return from HTTP method:</strong></p>
  <p><a href="https://i.stack.imgur.com/uqByD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uqByD.png" alt="enter image description here" /></a></p>
  <p>The problem is I am return when I try to return Areaview type then I cannot return property in vertical cards and when I return property type then I cannot return Areaview.</p>
  <p><strong>Edit: Vertical Cards class</strong></p>
  <pre><code>// ignore_for_file: prefer_const_constructors, must_be_immutable, use_key_in_widget_constructors, sized_box_for_whitespace
  
  import 'package:arzenafees/Components/Constants.dart';
  import 'package:arzenafees/model/areaview.dart';
  import 'package:arzenafees/services/areaviewapi.dart';
  import 'package:flutter/material.dart';
  
  class VerticalCards extends StatelessWidget {
    List&lt;Areaview&gt; areaData;
    VerticalCards(this.areaData);
    @override
    Widget build(BuildContext context) {
      return Container(
        decoration: BoxDecoration(color: Constants.colorSecond),
        height: MediaQuery.of(context).size.height,
        child: ListView.builder(
          scrollDirection: Axis.horizontal,
          itemCount: areaData.length,
          itemBuilder: (context, index) {
            final String? image = areaData[index] as String;
  
            return Container(
                // width: MediaQuery.of(context).size.width * 0.6,
                child: Padding(
              padding: const EdgeInsets.all(12.0),
              child: Card(
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(15.0),
                ),
                child: SizedBox(
                    width: 300,
                    height: 180,
                    child: GestureDetector(
                      onTap: () {},
                      child: Stack(alignment: Alignment.bottomLeft, children: [
                        Container(
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.all(Radius.circular(15.0)),
                            image: DecorationImage(
                              image: NetworkImage(image!),
                              fit: BoxFit.fill,
                            ),
                          ),
                        ),
                      ]),
                    )),
              ),
            ));
          },
        ),
      );
    }
  }
  </code></pre>