Yasith Samarawickrama
Yasith Samarawickrama

Reputation: 91

How to solve the "Type Null is not a subtype of type ..." error?

When I run the code below, it prints this error to the screen, and I don't know why:

type Null is not a subtype of type int

This is my model class for the data from the API:

class data {
  final int id;
  final String email;
  final String first_name;
  final String last_name;
  final String avatar;

  data({
    required this.id,
    required this.email,
    required this.first_name,
    required this.last_name,
    required this.avatar,
  });

  factory data.fromJson(Map<String, dynamic> json) {
    return data(
      id: json['id'],
      email: json['email'],
      first_name: json['first_name'],
      last_name: json['last_name'],
      avatar: json['avatar'],
    );
  }
}

API calling part(this part is the calling):

import 'dart:async';
import 'dart:convert';
import 'package:api_data/models/datamodel.dart';
import 'package:http/http.dart' as http;

class ApiManager {
  Future<data> fetchAlbum() async {
    final response =
        await http.get(Uri.parse('https://reqres.in/api/users?page=2'));

    if (response.statusCode == 200) {
      // If the server did return a 200 OK response,
      // then parse the JSON.
      return data.fromJson(jsonDecode(response.body));
    } else {
      // If the server did not return a 200 OK response,
      // then throw an exception.
      throw Exception('Failed to load album');
    }
  }
}

Main part

import 'package:api_data/models/datamodel.dart';
import 'package:api_data/network/api_data.dart';
import 'package:flutter/material.dart';

class Testpage extends StatefulWidget {
  const Testpage({Key? key}) : super(key: key);

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

class _TestpageState extends State<Testpage> {
  late Future<data> futureAlbum;

  @override
  void initState() {
    super.initState();
    futureAlbum = ApiManager().fetchAlbum();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Test2'), centerTitle: true),
      body: Center(
        child: FutureBuilder<data>(
          future: futureAlbum,
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return Text(snapshot.data!.email.toString());
            } else if (snapshot.hasError) {
              return Text("${snapshot.error}");
            }

            // By default, show a loading spinner.
            return CircularProgressIndicator();
          },
        ),
      ),
    );
  }
}

I don't understand why this doesn't work properly.

Upvotes: 9

Views: 49083

Answers (5)

KALARU BHUMIKA
KALARU BHUMIKA

Reputation: 1

make sure to check spelling while pushing and retrieving the data

Upvotes: 0

Wege
Wege

Reputation: 337

Do not use late Future<data> futureAlbum;

Use Future<data>? futureAlbum;

Upvotes: 0

Hasnain Rabby
Hasnain Rabby

Reputation: 1

You can use the Helper class.

class TypesHelper{
static int toInt(num val){
try{
  if(val == null){
    return 0;
  }
  if(val is int){
    return val;
  }else{
    return val.toInt();
  }
}catch(error){
  print('Error');
return 0;
}

}

Then you force conversion to int. On your Model class

id: TypesHelper.toInt(json['id']),

Upvotes: 0

Faiizii Awan
Faiizii Awan

Reputation: 1720

You are running with Null Safety enabled in your project. You have declared your all fields required and non-null in your Data Model Class.

Your API response is having a field absent or having a null value, that's why you are facing this issue.

Solution: Replacing int with int? (making fields optional will resolve issue).

Upvotes: 11

imnaman
imnaman

Reputation: 92

It appears to me that some of your json response might not have an id , so it's showing the error . You should check the json response you are getting and see if it has the id .

Upvotes: -1

Related Questions