Can t able fetch data form json using class in flutter dart

Question

I am trying to retrieve the temperature data from a weather API using a generated class in Dart, created with the JSON to Dart Extension. I have been able to retrieve the entire JSON response from the API, but when I try to access a single data using the class, it just prints null.

Future<Current> getweatherData({required String location}) async {
  final _response = await http.get(Uri.parse(
      'http://api.weatherstack.com/current?access_key=a80c4dfea39ef2093f3a0423200bed6a&query=$location'));
  print(_response.body); // Add this line to print the response from the API
  final _bodyJson = jsonDecode(_response.body) as Map<String, dynamic>;
  final _data = Current.fromJson(_bodyJson);
  print(_data.temperature); //showing null --
  return _data;
}

Generated code.

import 'package:json_annotation/json_annotation.dart';

part 'current.g.dart';

@JsonSerializable()
class Current {
  @JsonKey(name: 'observation_time')
  String? observationTime;
  int? temperature;
  @JsonKey(name: 'weather_code')
  int? weatherCode;
  @JsonKey(name: 'weather_icons')
  List<String>? weatherIcons;
  @JsonKey(name: 'weather_descriptions')
  List<String>? weatherDescriptions;
  @JsonKey(name: 'wind_speed')
  int? windSpeed;
  @JsonKey(name: 'wind_degree')
  int? windDegree;
  @JsonKey(name: 'wind_dir')
  String? windDir;
  int? pressure;
  int? precip;
  int? humidity;
  int? cloudcover;
  int? feelslike;
  @JsonKey(name: 'uv_index')
  int? uvIndex;
  int? visibility;
  @JsonKey(name: 'is_day')
  String? isDay;

  Current({
    this.observationTime,
    this.temperature,
    this.weatherCode,
    this.weatherIcons,
    this.weatherDescriptions,
    this.windSpeed,
    this.windDegree,
    this.windDir,
    this.pressure,
    this.precip,
    this.humidity,
    this.cloudcover,
    this.feelslike,
    this.uvIndex,
    this.visibility,
    this.isDay,
  });

  factory Current.fromJson(Map<String, dynamic> json) {
    return _$CurrentFromJson(json);
  }

  Map<String, dynamic> toJson() => _$CurrentToJson(this);
}

Answer 1

To fix the issue of null temperature data, you can:

1. Verify that the JSON response matches the Current class properties.
2. Check if the JSON response is not nested.
3. Make sure the fromJson() method is working correctly.
4. Add error handling to your API call and JSON parsing code.

Here's an updated code that includes error handling:

Future<Current> getWeatherData({required String location}) async {
  final response = await http.get(Uri.parse(
      'http://api.weatherstack.com/current?access_key=a80c4dfea39ef2093f3a0423200bed6a&query=$location'));

  if (response.statusCode == 200) {
    final bodyJson = jsonDecode(response.body) as Map<String, dynamic>;

    try {
      final data = Current.fromJson(bodyJson['current']);

      if (data.temperature != null) {
        return data;
      } else {
        throw Exception('Temperature data is missing');
      }
    } catch (e) {
      throw Exception('Error parsing JSON: $e');
    }
  } else {
    throw Exception('Failed to load weather data: ${response.statusCode}');
  }
}

This code checks for errors during API call and JSON parsing, and throws an exception if something goes wrong.

To know more, join our Flutter Training today.