JSON return null data (Flutter)

I need to load data right when the screen loads, I’m using PHP and MYSQL database, and those are working fine and retrieving the data needs to be retrieved so there’s no problem there.

I’m trying to retrieve data right when screen loads, the function is being completed correctly cause I print the data in the console and it returns "null" but when i go from screen 1(the screen where i want to load the data.) to screen 2(any screen) and then back to screen 1, the data does load on spot and doesn’t return null anymore, this only opens when first run the command "flutter run" and go to that screen it doesn’t work but when hot reload the screen or go to a a different and back to that one it works fine again, could anyone please help me?

Below is my code.

class StudentMessages extends StatefulWidget {   @override   _StudentMessagesState createState() => _StudentMessagesState(); }  class _StudentMessagesState extends State<StudentMessages> {    bool isLoading = false;    Future getChats() async{      final response = await http.get(       Uri.encodeFull("https://xxxxxxxxxxxx/xxx/x/x/xx/getChat.php?id=${u.id}&page=$page"),       headers: {         "Accept": 'application/json',       }     );     if(response.statusCode == 200){       setState(() {         jsonData = jsonDecode(response.body);         isLoading = true;       });       if(jsonData == null){         print("this shit ain't working fam.");       }       print(jsonData);     }    }   void initState(){     super.initState();     getChats();   }    @override   Widget build(BuildContext context) {     if(isLoading == true) {       return ListView.builder(         shrinkWrap: true,         padding: EdgeInsets.all(15),         itemCount: jsonData == null ? 0 : jsonData.length,         itemBuilder: (BuildContext context, int index) {           if(jsonData == null){             return new Container();           }else{             return new Card(               child: ListTile(                 leading: CircleAvatar(                   backgroundImage: AssetImage('assets/images/tutor2.jpg'),                 ),                 title: Text('${jsonData[index]['user_firstName']} ${jsonData[index]['user_lastName']}'),                 subtitle: Text(                   '${jsonData[index]['username']}',                   overflow: TextOverflow.ellipsis,                 ),                 onTap: () {                   Navigator.push(                     context,                     MaterialPageRoute(builder: (context) => ChatPage(tutorData: jsonData)),                   );                 },               ),             );             }           },         );     }else{       return Center(child:CircularProgressIndicator());     }             } }  
Add Comment
1 Answer(s)

In your code you are not using the variable isLoading correctly

at the start of your getChats function add setState((){ isLoading=true; });

and at the end of function setState((){ isLoading=false; });

as currently you are not using this

what’s going on is your layout is being drawn but with no data so null error is shown but when you call the screen another time data was preloaded so your layout just appears correct.

Future getChats() async{    setState((){ isLoading=true; });    final response = await http.get(     Uri.encodeFull("https://xxxxxxxxxxxx/xxx/x/x/xx/getChat.php?id=${u.id}&page=$page"),     headers: {       "Accept": 'application/json',     }    );      if(response.statusCode == 200){       jsonData = jsonDecode(response.body);       if(jsonData == null){         print("this shit ain't working fam.");       }       print(jsonData);   }   setState((){ isLoading=false; }); } 
Answered on July 16, 2020.
Add Comment

Your Answer

By posting your answer, you agree to the privacy policy and terms of service.