Flutter 分段条形图动态列表

我是个新手，我一直在做分段栏，目前我已经做了静态代码，希望做动态代码，我在做动态列表时遇到了一个问题，下面的代码是编写的

     import 'dart:async';
    import 'dart:convert';
    import 'package:flutter/cupertino.dart';
    import 'package:flutter/material.dart';
    import 'package:flutter/services.dart';
    import 'package:westerAf/paymentPage.dart';
    import 'package:http/http.dart' as http;

    class EventsPage extends StatefulWidget {
      @override
      EventsPageState createState() => new EventsPageState();
    }

    class EventsPageState extends State<EventsPage> {
      List data = List();

      String url = 'https://d57b9120.ngrok.io/api/events/westernaf/packages';
      Future<String> makeRequest() async {
        var response = await http
            .get(Uri.encodeFull(url), headers: {"Accept": "application/json"});

        setState(() {
          var extractdata = json.decode(response.body);
          data = extractdata["result"];
        });
      }

      int theirGroupValue = 0;

      final Map<int, Widget> logoWidgets = const <int, Widget>{
        0: Text('Early Bird'),
        1: Text('General'),
        2: Text('Onsite'),
      };

      static Widget giveCenter(String ListView) {
        return Container(
          child: Text(
            "Text: $ListView",
            style: TextStyle(color: Colors.blue, fontSize: 20.0),
          ),
        );
      }

     @override
  void initState() {
   super.initState(); 
    this.makeRequest();
  }

      List<Widget> bodies = [
        new ListView.builder(
          itemCount: data == null ? 0 : data.length,
          itemBuilder: (BuildContext context, i) {
            return new ListTile(
              title: new Text(data[i]["package"]),
              subtitle: new Text(data[i]["packageName"].toString()),
            );
          },
        ),
      ];

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: bodies[theirGroupValue],
          appBar: AppBar(
            elevation: 2.0,
            backgroundColor: Colors.white,
            centerTitle: true,
            title: Text(
              'title',
              style: TextStyle(color: Colors.black),
            ),
            bottom: PreferredSize(
              preferredSize: Size(double.infinity, 45.0),
              child: Padding(
                padding: EdgeInsets.only(top: 5.0, bottom: 10.0),
                child: Row(
                  children: <Widget>[
                    SizedBox(
                      width: 15.0,
                    ),
                    Expanded(
                      child: CupertinoSegmentedControl(
                        groupValue: theirGroupValue,
                        onValueChanged: (changeFromGroupValue) {
                          setState(() {
                            theirGroupValue = changeFromGroupValue;
                          });
                        },
                        children: logoWidgets,
                      ),
                    )
                  ],
                ),
              ),
            ),
          ),
        );
      }
    }

导入'dart:async'；
导入“dart:convert”；
进口“包装：颤振/cupertino.dart”；
进口“包装：颤振/材料.省道”；
导入“包：flifter/services.dart”；
导入“package:westerAf/paymentPage.dart”；
将“package:http/http.dart”导入为http；
类EventsPage扩展StatefulWidget{
@凌驾
EventsPageState createState（）=>新的EventsPageState（）；
}
类EventsPageState扩展状态{
列表数据=列表（）；
字符串url='0https://d57b9120.ngrok.io/api/events/westernaf/packages';
Future makeRequest（）异步{
var response=wait http
.get（Uri.encodeFull（url），头：{“接受”：“应用程序/json”}）；
设置状态（）{
var extractdata=json.decode（response.body）；
数据=提取数据[“结果”]；
});
}
int-theirGroupValue=0；
最终映射logoWidgets=const{
0:文本（“早起的鸟儿”），
1：文本（“概述”），
2：文本（“现场”），
};
静态窗口小部件giveCenter（字符串列表视图）{
返回容器(
子：文本(
“文本：$ListView”，
样式：TextStyle（颜色：Colors.blue，fontSize:20.0），
),
);
}
@凌驾
void initState（）{
super.initState（）；
这是makeRequest（）；
}
名单主体=[
新建ListView.builder(
itemCount:data==null？0:data.length，
itemBuilder：（构建上下文，i）{
返回新的ListTile(
标题：新文本（数据[i][“包”]），
字幕：新文本（数据[i][“packageName”].toString（）），
);
},
),
];
@凌驾
小部件构建（构建上下文）{
返回脚手架(
body:body[其分组值]，
appBar:appBar(
标高：2.0，
背景颜色：Colors.white，
标题：对，
标题：正文(
“头衔”，
样式：TextStyle（颜色：Colors.black），
),
底部：首选尺寸(
首选大小：大小（双精度无穷大，45.0），
孩子：填充(
填充：仅限边缘设置（顶部：5.0，底部：10.0），
孩子：排(
儿童：[
大小盒子(
宽度：15.0，
),
扩大(
子项：CupertinoSegmentedControl(
groupValue:theirGroupValue，
onValueChanged:（changeFromGroupValue）{
设置状态（）{
他们的分组值=更改自分组值；
});
},
孩子们：小部件，
),
)
],
),
),
),
),
);
}
}

在下面的代码中，我尝试做动态的。我有http get请求数据。这里data有信息列表和数据获取错误。我不知道怎么做。请帮我找出哪里出了错

List<Widget> bodies = [
    new ListView.builder(
      itemCount: data == null ? 0 : data.length,
      itemBuilder: (BuildContext context, i) {
        return new ListTile(
          title: new Text(data[i]["package"]),
          subtitle: new Text(data[i]["packageName"].toString() +
              ' ' +
              " price: " +
              data[i]["price"].toString()),
        );
      },
    ),
  ];

列表主体=[
新建ListView.builder(
itemCount:data==null？0:data.length，
itemBuilder：（构建上下文，i）{
返回新的ListTile(
标题：新文本（数据[i][“包”]），
字幕：新文本（数据[i][“packageName”].toString（）+
' ' +
“价格：”+
数据[i][“价格”].toString（）），
);
},
),
];

错误

这里的数据显示为红色，表示只有静态成员才能访问init 改变

到

为什么?

initState（）

是第一次将有状态小部件插入小部件树时调用的方法。

super.initState（）

转发到小部件的

State

基类的默认实现。在initState方法中，您不会错过它

2） 改变

列表数据

到

List data=List（）

为什么?

告诉框架列表不是固定的。否则，它将假定您的列表为空，因为您尚未为其指定任何默认值

代码的其余部分似乎很好，应该可以工作。如果仍然不起作用，请在评论中告诉我们。
请将错误添加到您的问题中好吗？我终于给出了错误代码，他们的数据正在向meMay发送错误。我们可以知道错误是什么吗？而不是“this.makeRequest（）；”调用
makeRequest（）。尝试在生成函数中移动
主体
定义。感谢您的回复，Aman，出现我收到此错误：错误：无法访问字段初始值设定项中的“this”以读取“data”。数据[i][“price”].toString（）），您是否用答案中提到的内容更新了您的代码？是的，我有更新代码，您提供给meI的代码将上载图片。为了清晰起见，请在声明
initState（）
之前移动您的
body
小部件
@override
  void initState() {
    this.makeRequest();
  }

@override
  void initState() {
   super.initState(); 
    this.makeRequest();
  }