False type when returning data from future because of parsing nested structure with list

Question

I am new to flutter and have experiences only with PHP, therefore you may find my questions nonsensical. If so, please do explain me what I am getting wrong, thank you. I am using two projects as source for my project: https://github.com/abdl-slm/FlutterGridFutureExample and https://github.com/PoojaB26/ParsingJSON-Flutter .

I am trying to modify get data from API using Future builder and grid_view, but I am getting this message when I try to return the list from the future:

A value of type 'ActionsList' can't be returned from function 'getActions' because it has a return type of 'Future<List>'.

I have tested that there is no proble with parsing the data to the ActionsList (i can print them inside the future) but I can't get them to the rest of futurebuilder.

The future goes like this:

Future<List<ActionsList>> getActions() async {
  final response = await http.get(
    "https://www.myproject.cz/api/...",
    headers: {
      "contentType": "application/x-www-form-urlencoded",
      "Authorization": "Bearer ...",
    },
  );

  if (response.statusCode == 200) {
    Map<String, dynamic> decodedActions = json.decode(response.body);
    String encodedActions = jsonEncode(decodedActions['actions_data']);

    final jsonResponse = json.decode(encodedActions);
    ActionsList actionsList = ActionsList.fromJson(jsonResponse);

    print("got data from API check: " + actionsList.actions[0].name);

    return actionsList;

  } else {
    throw Exception('Failed to load actions');
  }
}

The JSON from API is:

{
  "actions_data": [
    {
      "id": "245629634987701888",
      "shop_id": "182980954485185472",
      "name": "Slevový kupón 10 % na techniku na FotoŠkoda",
      "valid_from": "2020-11-08T00:00:00+00:00",
      "valid_to": null,
      "description": "",
      "type": "coupon",
      "other_type": null,
      "discount": "10",
      "discount_type": "%",
      "discount_coupon": "POH10",
      "image_mobile_url": null,
      "aggregator": "affiliate_port",
      "redirect_link": "https://project.cz/aff_c?offer_id=234&aff_id=5921&aff_sub=107553508877665280"
    },
    {
      "id": "245628934350208704",
      "shop_id": "180719630782866560",
      "name": "Slevový kupon 200 Kč na dioptrické brýle na Alensa",
      "valid_from": "2020-11-08T00:00:00+00:00",
      "valid_to": null,
      "description": "",
      "type": "coupon",
      "other_type": null,
      "discount": "200",
      "discount_type": "CZK",
      "discount_coupon": "dioptricke200",
      "image_mobile_url": null,
      "aggregator": "ehub",
      "redirect_link": "https://project.cz/click.php?a_aid=bb9f4d85&a_bid=acf4b661&data1=107553508877665280"
    },
    {
      "id": "243716688296602880",
      "shop_id": "194864134897055232",
      "name": "Sleva na nábytek až 20%",
      "valid_from": "2020-11-03T00:00:00+00:00",
      "valid_to": null,
      "description": "",
      "type": "coupon",
      "other_type": null,
      "discount": "10",
      "discount_type": "%",
      "discount_coupon": "20AUTUMN",
      "image_mobile_url": "https://www.project.cz/actions-images/243716688296602880-mobile-699018679.png",
      "aggregator": "dognet",
      "redirect_link": "http://www.project.cz/sd?data1=107553508877665280"
    },...

The ActionList class to map the data:

import 'dart:convert';

class ActionsList {
  final List<ActionsData> actions;

  ActionsList({
    this.actions,
  });

  factory ActionsList.fromJson(List<dynamic> parsedJson) {

    List<ActionsData> actions = new List<ActionsData>();
    actions = parsedJson.map((i)=>ActionsData.fromJson(i)).toList();

    return new ActionsList(
        actions: actions
    );
  }
}


class ActionsData {
  final String id;
  final String shopId;
  final String name;
  final String validFrom;
  final String validTo;
  final String description;
  final String type;
  final String otherType;
  final String discount;
  final String discountType;
  final String discountCoupon;
  final String imageMobileUrl;
  final String aggregator;
  final String redirectLink;

  ActionsData(
      {this.id,
        this.shopId,
        this.name,
        this.validFrom,
        this.validTo,
        this.description,
        this.type,
        this.otherType,
        this.discount,
        this.discountType,
        this.discountCoupon,
        this.imageMobileUrl,
        this.aggregator,
        this.redirectLink});

  Map<String, dynamic> toJson(){
    return {
    "id": this.id,
    "shopId": this.shopId,
    "name": this.name,
    "validFrom": this.validFrom,
    "validTo": this.validTo,
    "description": this.description,
    "type": this.type,
    "otherType": this.otherType,
    "discount": this.discount,
    "discountType": this.discountType,
    "discountCoupon": this.discountCoupon,
    "imageMobileUrl": this.imageMobileUrl,
    "aggregator": this.aggregator,
    "redirectLink": this.redirectLink
    };
  }

  factory ActionsData.fromJson(Map<String, dynamic> json){
    return new ActionsData(
        id: json['id'],
        shopId: json['shop_id'],
        name: json['name'],
        validFrom: json['valid_from'],
        validTo: json['valid_to'],
        description: json['description'],
        type: json['type'],
        otherType: json['other_type'],
        discount: json['discount'],
        discountType: json['discount_type'],
        discountCoupon: json['discount_coupon'],
        imageMobileUrl: json['image_mobile_url'],
        aggregator: json['aggregator'],
        redirectLink: json['redirect_link']);
  }
}

And the rest of the main screen:

class ThirdScreen extends StatefulWidget {
  ThirdScreen({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _ThirdScreenState createState() => _ThirdScreenState();
}

class _ThirdScreenState extends State<ThirdScreen> with TickerProviderStateMixin {

  Future<List<ActionsList>> futureAction;


  @override
  void initState() {
    super.initState();
   futureAction = getActions();

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        titleSpacing: 0.0,
        title: IconButton(
          icon: Icon(
            Icons.shopping_cart,
          ),
          onPressed: () {},
        ),
        actions: <Widget>[
          IconButton(
            icon: Icon(
              Icons.menu,
            ),
            onPressed: () {},
          )
        ],
      ),
      body: Center(
          child: FutureBuilder<List<ActionsList>>(
        future: futureAction,
        builder: (context, AsyncSnapshot snapshot) {
          if (!snapshot.hasData) {
            print("snapshot doesn't have data");
            return Center(child: CircularProgressIndicator());
          } else {
           // print(snapshot.data);
            return Container(child: _albumGridView(snapshot.data));
          }
        },
      )),
    );
  }
}

Thanks for any hints or samples!

Answer 1

Future<ActionsList>() async {
  final response = await http.get(
    "https://www.myproject.cz/api/...",
    headers: {
      "contentType": "application/x-www-form-urlencoded",
      "Authorization": "Bearer ...",
    },
  );

  if (response.statusCode == 200) {
    Map<String, dynamic> decodedActions = json.decode(response.body);
    String encodedActions = jsonEncode(decodedActions['actions_data']);

    final jsonResponse = json.decode(encodedActions);
    ActionsList actionsList = ActionsList.fromJson(jsonResponse);

    print("got data from API check: " + actionsList.actions[0].name);

    return actionsList;

  } else {
    throw Exception('Failed to load actions');
  }
}

change the return type of your function from "Future<List<ActionList>>" to "Future<ActionList>" and it will solve your problem.

Answer 2

your Future method wont return anything unless you return value outside the else if statement. change your code to:

Future<List<ActionsList>> getActions() async {
ActionsList actionsList;
  final response = await http.get(
    "https://www.myproject.cz/api/...",
    headers: {
      "contentType": "application/x-www-form-urlencoded",
      "Authorization": "Bearer ...",
    },
  );

  if (response.statusCode == 200) {
    Map<String, dynamic> decodedActions = json.decode(response.body);
    String encodedActions = jsonEncode(decodedActions['actions_data']);

    final jsonResponse = json.decode(encodedActions);
    actionsList = ActionsList.fromJson(jsonResponse);

    print("got data from API check: " + actionsList.actions[0].name);

  } else {
    throw Exception('Failed to load actions');
  }
return actionsList;
}

hope this will work for you.