need help in API integration

Maaz Mehdi 0
Viewed 35

I hope you all are well. I got a problem i am learning API integration in flutter now a days the problem I am facing is i can't get data here is the code below:

class _AppState extends State<App> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: FutureBuilder(
      future: getuser(),
      builder: (BuildContext context, AsyncSnapshot snapshot) {
        if (snapshot.data == null) {
          return CircularProgressIndicator();
        } else {
          return ListView.builder(
            itemCount: snapshot.data.length,
            itemBuilder: (context, index) {
              return ListTile(
                title: Text(snapshot.data[index].title),
              );
            },
          );
        }
      },
    ));
  }
}

it is only showing me circular indicator i am using API 'https://jsonplaceholder.typicode.com/posts'.

I tried to check if the API is working so i check it by passing a hello in list tile and getting the hello by the length of API given in item count and actually that showed me output according to length please help me out so that i can move forward. Thank You. Here is the function also:


import 'package:apiintegration/model/user_model.dart';
import 'package:http/http.dart' as http;

getuser() async {
  var url = Uri.parse('https://jsonplaceholder.typicode.com/posts');
  var response = await http.get(url);
  var responsedata = jsonDecode(response.body);
  return UserModel.fromJson(responsedata);```
flutter
2 Answers

You should continue step by step.

As you said if you have success response and not null data, you might have parsing problem.

You should go to your url => https://jsonplaceholder.typicode.com/posts again and copy the json data.

Open https://app.quicktype.io/ site and paste your json data here to create related parsing methods.

Make http request again. If you parse the json data correctly check out getUser method in view file.

When you get response, be sure that you re-draw(setState etc.) the ui for displaying parsed json data.

If everything works well you should handle all the states that you can have from FutureBuilder such as:

if(snapshot.connectionState == ConnectionState.none) {...}

else if(snapshot.connectionState == ConnectionState.waiting) {...}

else if(snapshot.connectionState == ConnectionState.done) {
   if(snapshot.hasError) {...}

   if(snapshot.hasData)  {...}
}
Kadir BEKAR0

problem is here

 return UserModel.fromJson(responsedata);```

it should be userModelFromJson(responsedata);

Example Model:

import 'dart:convert';

DefaultModel defaultModelFromJson(String str) =>
    DefaultModel.fromJson(json.decode(str));

String defaultModelToJson(DefaultModel data) => json.encode(data.toJson());

class DefaultModel {
  DefaultModel({
    this.response,
    this.data,
  });

  String? response;
  String? data;

  factory DefaultModel.fromJson(Map<String, dynamic> json) => DefaultModel(
        response: json["response"],
        data: json["data"],
      );

  Map<String, dynamic> toJson() => {
        "response": response,
        "data": data,
      };
}
Tasnuva Tavasum oshin0
Related