I want to get json from api in flutter - json

Question

class Phone{
int? id;
bool? is_new;
String? title;
String? subtitle;
String? picture;
bool? is_buy;
dynamic best_seller;
int? price_without_discount;
int? discount_price;
Phone({
this.id,
this.is_new,
this.title,
this.subtitle,
this.picture,
this.is_buy,
this.best_seller,
this.price_without_discount,
this.discount_price
});
factory Phone.fromJson(Map <String, dynamic> json) => Phone(
id: json[MyPhoneKeys.id],
is_new: json[MyPhoneKeys.is_new],
title: json[MyPhoneKeys.title],
subtitle: json[MyPhoneKeys.subtitle],
picture: json[MyPhoneKeys.picture],
is_buy: json[MyPhoneKeys.is_buy],
best_seller: json[MyPhoneKeys.best_seller],
price_without_discount: json[MyPhoneKeys.price_without_discount],
discount_price: json[MyPhoneKeys.discount_price]
);
}
(My screen to display the data)
class CarouselSliderData extends StatefulWidget{
const CarouselSliderData({super.key});
#override
State<CarouselSliderData> createState() => CarouselSliderDataState();
}
class CarouselSliderDataState extends State<CarouselSliderData> {
int? id;
bool? is_new;
String? title;
String? subtitle;
dynamic picture;
bool? is_buy;
dynamic best_seller;
int? price_without_discount;
int? discount_price;
late Future<dynamic> phoneSpec;
#override
void initState() {
phoneSpec = MyApiService().getDataMocky();
super.initState();
}
#override
Widget build(BuildContext context) {
return FutureBuilder<dynamic>(
future: phoneSpec,
builder: (context, snapshot) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(snapshot.data!.id),
Text(snapshot.data!.is_new),
Text(snapshot.data!.title),
Text(snapshot.data!.subtitle),
Text(snapshot.data!.picture),
Text(snapshot.data!.is_buy),
Text(snapshot.data!.best_seller),
Text(snapshot.data!.price_without_discount),
Text(snapshot.data!.discount_price),
],
);
}
);
}
Future<dynamic> getData() async{
return await MyApiService().getDataMocky().then((value) async{
if(value != null){
setState((){
id = value!.id!;
is_new = value!.is_new!;
title = value!.title!;
subtitle = value!.subtitle!;
picture = value!.picture!;
is_buy = value!.is_buy!;
best_seller = value!.best_seller!;
price_without_discount = value!.price_without_discount!;
discount_price = value!.discount_price!;
});
return value;
}
},
);/*.catchError((_){
throw Exception("Exception is caught");
});*/
}
}
(my service to get data)
import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:my_work/apiService/model.dart';
class MyApiService{
Future<dynamic> getDataMocky() async {
final response = await http.get(
Uri.parse('https://run.mocky.io/v3/654bd15e-b121-49ba-a588-960956b15175')
);
if(response.statusCode == 200){
return Phone.fromJson(json.decode(response.body)[1]);
}
return Exception();
}
}
is my model right for this api json from this api.
I want to get data and display them in carousel Slider(i will add it) but get nulls. The Error is saying Null is not subtype of String and nullcheck is used on NULL value and i don't know why and where is my mistake. Thank you very much

Answer 1

Text widget doesnt accept nullable string.
Instead of using ! it would be better to check null first, or you can provide default value on null case. Format will be like
if(snapshot.data!=null) Text(snapshot.data.id),
Or
Text(snapshot.data?.id??"got null"),
Or use String format like bellow, it will show null on null case.
Text("${snapshot.data?.id}"),
I will recommend checking understanding-null-safety