Api data null whe nthe pages load even i use initState

Issue

im using post method to get api data/response.body in initState and i get all the response/data then i put it in my variables surveyData, but when i load the pages with widget looped by the response.body length it goes error and say response.body.length is null but when i save the text editor/ hot reload, all the data entered and it's not null anymore and the widget appear.

fyi: the http.post method is my own function not from import 'package:http/http.dart' as http; so don't mind it

Variables that contain the response

  dynamic surveyData;

initState Code

@override
      void initState() {
        super.initState();
    
        // GET PAGES
        surveyPages = widget.surveyPages;
    
        // GET FORM DETAIL
        http.post(
          'survey-pre-mitsu/form-detail',
          body: {
            "survey_form_header_id": 1,
          },
        ).then(
          (res) {
            surveyData = res['data'];
          },
        );
      }

Widget that looped by surveyData.length

  for (var i = 0; i < surveyData.length; i++)
                AdditionalForm(questionLabel: surveyData[i]['label'],
                  questionType: surveyData[i]['type'],),
                  
                

This is what the error

And this is what it looks like when i do hot reload

Solution

First, I suggest you to use future builder to resolve this problem.

Answered By - Genius_balu