Flutter where to put http.get - flutter

Question

I am making lecture room reservation system.
class SearchView2 extends StatefulWidget {
#override
_SearchViewState2 createState() => _SearchViewState2();
}
class _SearchViewState2 extends State<SearchView2> {
String building = Get.arguments;
List data = [];
String roomID = "";
int reserved = 0;
int using = 0;
Future<String> getData() async {
http.Response res = await http.get(Uri.parse(
"https://gcse.doky.space/api/schedule/classrooms?bd=$building"));
http.Response res2 = await http.get(Uri.parse(
"https://gcse.doky.space/api/reservation/currtotal?bd=$building&crn=$roomID"));
reserved = jsonDecode(res2.body)["reserved"];
using = jsonDecode(res2.body)["using"];
this.setState(() {
data = jsonDecode(res.body)["result"];
});
return "success";
}
#override
void initState() {
super.initState();
this.getData();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('강의실 선택')),
body: new ListView.builder(
itemCount: data == null ? 0 : data.length,
itemBuilder: (BuildContext context, int index) {
roomID = data[index];
return new Card(
child: ListTile(
onTap: () async {}, title: Text(data[index] + " " + reserved)),
);
},
),
);
}
}
I want to get 'using' and 'reserved' data and print them in the list view.
But roomID is in Listview
I want data[index] as roomID but with my code roomID will be null, so it won't print the result.
Where should I move http.Response res2? (not res)
Or is there other way to get using and reserved data in the listview?

Answer 1

First of all, you have a single building and multiple rooms in that building. So, fetching a building data along with the data of all it's rooms together will take too much time.
Instead, you can break it into two parts.
For fetching Building data,
Future<List<String>> getData() async {
http.Response res = await http.get(Uri.parse("https://gcse.doky.space/api/schedule/classrooms?bd=$building"));
return (jsonDecode(res.body)["result"] as List)
.map<String>((e) => e.toString())
.toList();
}
Then, for fetching each room data, Here you have to pass roomID.
Future<Map<String, dynamic>> getRoomData(String roomID) async {
http.Response res2 = await http.get(Uri.parse("https://gcse.doky.space/api/reservation/currtotal?bd=$building&crn=$roomID"));
return {
'reserved': jsonDecode(res2.body)["success"]["reserved"],
'using': jsonDecode(res2.body)["success"]["using"],
};
}
Now, you can use FutureBuilder widget to build something that depends on fetching data asynchronously.
You also don't need a StatefulWidget since you are using FutureBuilder and can remove all unnecessary local variables you have defined.
Here is the full working code. PasteBin Working Code.
Just replace your entire SearchView2 code with the code in the link.
This is the output.