Unable to initialize variables before build? - flutter

Question

I am working on app which requires me to fetch data from the server (in my case a simple firebase real time database) and store the fetched data in map before the build method is called since i will be needing to use the map in the build method.
Here I have tried to recreate the error using a test code.
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
class Test extends StatefulWidget {
#override
Map<String, dynamic> livefeed;
State<StatefulWidget> createState() {
// TODO: implement createState
return TestState();
}
}
class TestState extends State<Test> {
#override
void initState() {
http
.get('HERE GOES THE URL FOR THE DATABASE ,CANT DISCLOSE')
.then((http.Response response) {
widget.livefeed = json.decode(response.body);
print(widget.livefeed);
print(widget.livefeed.length);
});
// TODO: implement initState
super.initState();
}
#override
Widget build(BuildContext context) {
return Container(
child: Text(widget.livefeed.toString()),
);
}
}
The Console print :
{-Lh7FJV_7FIXgEUUS3Is: {skill: Andriod dev, target: Just Entered The Lab.,
username: test}, -Lh7RKgw3K2ZuKjrBZd2: {skill: Andriod dev, target: Just
Entered The Lab., username: test}}
I/flutter ( 7078): 2
Yet my UI shows null when i try to display the map on the screen
inside the build method.
I am aware that initState() method is called before the Build() method yet initialization fails, the debug console confirms that data is being fetched yet it fails to be printed on the screen implying build is being called before the values are initialized .

Answer 1

You need to put this inside a setState method
widget.livefeed = json.decode(response.body);
And ofcourse you need to handle what to show while the widget.livefeed is null. As you said even initState() method is called before the Build() method, http.get() is an async function. You can't assure that it will finish before build method is called BECAUSE IT IS AN ASYNC FUNCTION.
You can handle it like this
Text(widget.livefeed!=null?widget.livefeed.toString():'some default text like loading...'),