How to use response body in another screen - json

Question

I am trying to use the response.body from a request made in network.dart in main.dart, but it does not seem to work here is my code
import 'package:http/http.dart'as http;
import 'dart:async';
import 'dart:convert';
import 'dart:io';
class Network {
var data;
Future fetchData() async {
Map<String, String> headers = {
HttpHeaders.contentTypeHeader: "application/json",
HttpHeaders.acceptHeader: "application/json",
HttpHeaders.authorizationHeader: "Bearer $token",
};
http.Response response = await http.get (url),
headers: headers,
);
if (response.statusCode == 200) {
data = response.body;
return jsonDecode(data);
} else {
print('this is the ${response.statusCode}');
}
}
}
in the main.dart i am trying to print network.data but its null and when mapping json values i get all nulls what am i missing
Edit below i am assigning a var called body to to the result of the fetchdata in hte network but it does not seem to work when i print i run i get this "Unhandled Exception: type '_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 'Future'"
import 'package:flutter/material.dart';
import 'package:foodicsclimamethod/networking.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
Network network = Network();
String productName;
int productPrice;
String productData;
void updateUi() async {
Future<dynamic> body = await network.fetchData();
print(body);
}
#override
void initState() {
super.initState();
network.fetchData();
}

Answer 1

It looks like there is an issue with the updateUi method in your code sample. The body variable is typed as Future<dynamic>, however it should be dynamic because you are awaiting the fetchData method. If you wanted to, you could avoid specifying a type altogether and simply use final in order to infer the type. I have included a complete example below showing how this could all fit together:
import 'dart:convert';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
void main() {
runApp(MyApp());
}
class Network {
Future fetchData() async {
final headers = <String, String>{
HttpHeaders.contentTypeHeader: 'application/json',
HttpHeaders.acceptHeader: 'application/json',
HttpHeaders.authorizationHeader: 'Bearer $token',
};
final response = await http.get(url, headers: headers);
if (response.statusCode >= 200 && response.statusCode < 300) {
return json.decode(response.body);
} else {
throw Error();
}
}
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
}
class HomePage extends StatefulWidget {
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
Future _future;
#override
Widget build(BuildContext context) {
return Scaffold(
body: FutureBuilder(
future: _future,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text(snapshot.data.toString());
} else {
return CircularProgressIndicator();
}
},
),
);
}
#override
void initState() {
super.initState();
_future = Network().fetchData();
}
}