Flutter snapshot.data.length return wrong value - json

Below is my example snapshot.data.length return 2 but in my example is 15 what is wrong here?
class ApiService {
static Future<dynamic> _get(String url) async {
try {
final response = await http.get(url);
var jsonData = json.decode(response.body);
return jsonData;
}
}
static Future<Map<String, dynamic>> getUserList() async {
return await _get('${Urls.BASE_API_URL}');
}
.........
body: FutureBuilder(
future: ApiService.getUserList(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
final posts = snapshot.data;
print(posts.length); //Return 2
Json URL: http://www.json-generator.com/api/json/get/cqwVqdOFrC?indent=2

No it's 2 not 15
{"items":[],"first":[]}
if you want the items only
final posts = snapshot.data["items"];
print(posts.length);
It will be 15

Related

snapshot.hasData is true but the snapshot.data.length is null, Flutter

I'm calling an API from a component that returns some data, but the problem is snapshot.hasData is true but the snapshot.data.length is 0. Am I parsing the data wrong(again)? The code:
API call service component:
Future<List<User>> getUsers() async {
final response = await APIRequest(Method.GET, '/users');
if (response.statusCode == 200) {
var body = jsonDecode(response.body)['data'];
print('this is the response body: ' + response.body); // it returns data completely
List<User> users = [];
body.map((e) {
User user = User.fromJson(e);
users.add(user);
});
return users;
} else {
print('Error occurred! Data is not fetched!');
}
}
The user list component:
Future<List<User>> _getUserList() async {
var _userData = await APIcalls.instance.getUsers();
return _userData;
}
FutureBuilder<List<User>>(
future: _getUserList(),
builder: (context, snapshot) {
if (snapshot.hasData) {
print(snapshot.hasData.toString()); // returns true
print(snapshot.data.length); // returns 0
return ListView.builder(
shrinkWrap: true,
itemCount: snapshot.data.length,
itemBuilder: (context, index) {
print(snapshot.data.length);
return Text(snapshot.data[index].userId);
},
);
} else if (snapshot.hasError) {
return Text("${snapshot.error}");
}
return Container();
},
)
Try this:
List<User> users = List.from(body).map((e) => User.fromJson(Map.from(e))).toList();
return users;

Flutter - How to parse JSON data?

I want to parse my JSON data and display all the nodeValues of the rows and not just [7] (which contains the word hello), however my FutureBuilder doesn't display the JSON data (stuck on CircularProgressIndicator) even though i'm following the correct JSON path.
//Updated code
class Feed {
String title;
Feed({this.title});
factory Feed.fromJson(Map<String, dynamic> json) {
return Feed(
title: json["data"]["tables"][0]["rows"][7]["cols"][1]["nodeValue"]);
}
}
//I am making a post method to an API that returns me a JSON output.
Future<List<Feed>> post() async {
final Response<String> result =
await Dio().get('https://example.com');
String _baseUrl = "https://html2json.com/api/v1";
var options = Options(
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
followRedirects: false,
);
final response = json.decode(result.data);
final responseJson = await Dio().post(
_baseUrl,
data: response,
options: options,
);
if (responseJson.statusCode == 200) {
return (response as List).map((json) => Feed.fromJson(json)).toList();
} else {
return null;
}
}
//This is stuck on CircularProgressIndicator();
FutureBuilder(
future: post(),
builder: (context, AsyncSnapshot<List<Feed>> snap) {
if (snap.hasData) {
return ListView.builder(
itemCount: snap.data.length,
itemBuilder: (BuildContext context, int index) {
return Text(snap.data[index].title);
});
} else {
return CircularProgressIndicator();
}
});
I changed a few things to make your code work with the json place holder. You were using response.statusCode == 200, but response has no status code, the status code is on the var link.
class Feed {
String title;
Feed({this.title});
factory Feed.fromJson(Map<String, dynamic> json) {
return Feed(title: json["title"]);
}
}
Future<List> post() async {
final Response<String> result = await Dio().get('https://jsonplaceholder.typicode.com/todos');
final response = json.decode(result.data);
if (result.statusCode == 200) {
return (response as List)
.map((json) => Feed.fromJson(json))
.toList();
} else {
return null;
}
}
return FutureBuilder(
future: post(),
builder: (context, AsyncSnapshot<List> snap) {
if (snap.hasData) {
return ListView.builder(
itemCount: snap.data.length,
itemBuilder: (BuildContext context, int index) {
return Text(snap.data[index].title);
});
} else {
return CircularProgressIndicator();
}
});

Flutter Futurebuilder snapshot is null

I try to show the results from JSON in a ListView in Flutter with a FutureBuilder.
But the snapshot is null and the message that no data is available shows.
Here I try to fetch the data:
static Future _getBans() async {
Storage.getLoggedToken().then((token) async {
var body = {
"token": token
};
final response = await http.post('${URLS.BASE_URL}/punishments.php', headers: ApiService.header, body: json.encode(body));
if (response.statusCode == 200) {
List<Ban> bans = [];
var jsonData = json.decode(response.body)["bans"];
for(var b in jsonData){
Ban ban = Ban(b["player"], b["reason"], int.parse(b["end"]), b["by"]);
bans.add(ban);
}
print(response.body);
print(bans.length);
return bans;
} else {
return null;
}
});
}
from this JSON response
{"status":1,"msg":"OK","bans":[{"player":"DDOSAttacke","reason":"Hacking","end":"1579275471304","by":"DDOSAttacke"}],"mutes":[]}
My Futurebuilder. Here is snapshot null but the count of the elements is working.
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Aktive Bans'),
),
body: Container(
child: FutureBuilder(
future: _getBans(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.data == null) {
return Container(
child: Center(
child: Text('Keine aktiven Ban vorhanden')
),
);
} else {
return ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Text(snapshot.data[index].player),
);
},
);
}
},
),
),
);
}
Please try this. I think you'll have to use await keyword for the getLoggedToken mothod, the returnwill wait for the post before returning anything. But now you're returning before the getLoggedTokenfinishes his work. That is why you are always receiving null.
static Future _getBans() async {
var token = await Storage.getLoggedToken();
var body = {
"token": token
};
final response = await http.post('${URLS.BASE_URL}/punishments.php', headers: ApiService.header, body: json.encode(body));
if (response.statusCode == 200) {
List<Ban> bans = [];
var jsonData = json.decode(response.body)["bans"];
for(var b in jsonData){
Ban ban = Ban(b["player"], b["reason"], int.parse(b["end"]), b["by"]);
bans.add(ban);
}
print(response.body);
print(bans.length);
return bans;
} else {
return null;
}
}

Flutter snapshot data is empty

I'm new in flutter, I try parse data from rest api.
Api return:
http://www.json-generator.com/api/json/get/cqwVqdOFrC?indent=2
Eg. Here get data from json api eg. length is 3231
class ApiService {
static Future<dynamic> _get(String url) async {
try {
final response = await http.get(url);
var jsonData = json.decode(response.body);
if (response.statusCode == 200) {
print(response.body.length); //3231
return jsonData;
} else {
return null;
}
}
}
but here is snapshot.hasData = False, Why?
return Scaffold(
appBar: AppBar(title: Text('Posts'),),
body: FutureBuilder(
future: ApiService.getUserList(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
print(snapshot.hasData.toString()); //False no data
static Future<List<dynamic>> getUserList() async {
return await _get('${Urls.BASE_API_URL}');
}
Without items at the beginning of json all work fine. My web server return items at the beginning. Any solutions?
api returns Map<String, dynamic> not <List<dynamic>>
class ListaAbitudini extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return new _ListaAbitudiniState();
}
}
class _ListaAbitudiniState extends State<ListaAbitudini> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Posts'),
),
body: FutureBuilder(
future: ApiService.getUserList(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if(snapshot.hasData)
print("True");
return Container();
}));
}
}
class ApiService {
static Future<Map<String, dynamic>> getUserList() async {
return await _get('http://www.json-generator.com/api/json/get/cqwVqdOFrC?indent=2');
}
static Future<dynamic> _get(String url) async {
try {
final response = await http.get(url);
var jsonData = json.decode(response.body);
if (response.statusCode == 200) {
print(response.body.length); //3231
return jsonData;
} else {
return null;
}
} catch (e) {
print(e);
}
}
}
Have to try calling,
future: ApiService.getUserList().then((onValue) {
return onValue;
}
Usually you get hasData = false when hasError = true. Try to look for a snapahot error (snapshot.error)

Getting error type'_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 'Iterable<dynamic>' while fetching data from API in flutter

I am new to flutter and I tried fetching data from API but I got the error
type'_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 'Iterable<dynamic>'.
I am fetching news data from the API. I tried this for simple API and it worked and when I tried it for a complex API with some changes in the dart code I got this error.
Sorry if I didn't explain correctly. I have pasted all the code that has been used for this API.
I am not getting any solution. I am posting my code here.
post.dart
class Post {
List<Articles> articles;
Post({this.articles});
factory Post.fromJson(Map<String, dynamic> json) {
return Post(
articles: json['articles'].map((value) => new Articles.fromJson(value)).toList(),
);
}
}
article.dart
class Articles{
final String title;
final String description;
final String url;
final String urlToImage;
final String publishedAt;
final String content;
Articles({this.title, this.description, this.url, this.urlToImage, this.publishedAt, this.content});
factory Articles.fromJson(Map<String, dynamic> json) {
return Articles(
title: json['title'],
description: json['description'],
url: json['url'],
urlToImage: json['urlToImage'],
publishedAt: json['publishedAt'],
content: json['content'],
);
}
}
technology_post.dart
Future<List<Post>> fetchPost() async {
final response = await http.get('https://newsapi.org/v2/top-headlines?sources=techcrunch&apiKey=47ada2986be0434699996aaf4902169b');
if (response.statusCode == 200) {
var responseData = json.decode(response.body);
List<Post> posts = [];
for(var item in responseData){
Post news = Post.fromJson(item);
posts.add(news);
}
return posts;
} else {
throw Exception('Failed to load post');
}
}
class Technology extends StatelessWidget{
final Future<List<Post>> post;
Technology({Key key, this.post}) : super (key : key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: FutureBuilder<List<Post>>(
future: post,
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView.builder(
itemBuilder: (BuildContext context, int index){
var dataStored = "";
for(var i = 0; i < 10; i++){
dataStored = snapshot.data.articles[i].title;
return ListTile(
title: Text(dataStored),
);
}
}
);
} else if (snapshot.hasError) {
return Text("${snapshot.error}");
}
return CircularProgressIndicator();
},
),
),
);
}
}
homescreen.dart
TabBarView(
children: [
Technology(post: fetchPost()),
Text('General'),
Text('Cricket')
]
I have posted all the required code I hope. If you want to see the API you can see that here
Sorry if I have pasted much code here.
Why am I getting this error and how can I resolve this.
Thanks in advance.
According to your json, there is no List but only Post as json is json object.
So change your fetchPost() function as follows:
Future<Post> fetchPost() async {
final response = await http.get(
'https://newsapi.org/v2/top-headlines?
sources=techcrunch&apiKey=$YOUR_API_KEY');
if (response.statusCode == 200) {
var responseData = jsonDecode(response.body);
var post = Post.fromJson(responseData);
return post;
} else {
throw Exception('Failed to load post');
}
}
NOTE : Remove your api key from your question and paste json only for privacy.
And change your technology class to
class Technology extends StatelessWidget {
final Future<Post> post;
Technology({Key key, this.post}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: FutureBuilder<Post>(
future: post,
builder: (context, snapshot) {
if (snapshot.hasData) {
return ListView.builder(
itemBuilder: (BuildContext context, int index) {
return Text(snapshot.data.articles[0].publishedAt);
});
} else if (snapshot.hasError) {
return Text("${snapshot.error}");
}
return CircularProgressIndicator();
},
),
),
);
}
}
and your main problem is also that you have not cast json['articles'] to list. you should change Post.fromJson function to
factory Post.fromJson(Map<String, dynamic> json) {
return Post(
articles: (json['articles'] as List).map((value) => new Articles.fromJson(value)).toList(),
);
}
This should solve your problem.
You should check correct response type Int with String. I see your API status: "ok" and sure you check correctly.