Api 即使我使用 initState,当页面加载时数据为空

Api data null whe nthe pages load even i use initState

我使用 post 方法在 initState 中获取 api data/response.body 并且我获取所有 response/data 然后我将它放入我的变量 surveyData, 但是当我加载带有由 response.body 长度循环的小部件的页面时,它会出错并说 response.body.length 为空但是当我保存文本编辑器/热重载时,输入的所有数据都是不再为空,小部件出现。

仅供参考:http.post 方法是我自己的函数,不是来自 import 'package:http/http.dart' as http; 所以不要介意

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

首先,我建议执行 post(即使它是您自己的代码)作为 异步 操作,因此不在 initState() 中。最好将逻辑编写在单独的 class/file 中,并使用像提供程序包这样的包。先试试这个,然后 post 之后的错误。

你需要添加一些延迟,在这个延迟中你可以显示一个加载图标。对于延迟,您可以使用:

Future.delayed(const Duration(milliseconds: 500), () {

// Here you can write your code

  setState(() {
    // Here you can write your code for open new view
  });

});

这将解决您的问题

首先,我建议你使用future builder来解决这个问题。