如何在颤振应用程序中获取JSON数据？

Question

下面的JSON数据是从服务器获取的，我需要在pageviewbuilder以及flutter应用程序中的listview构建器中获取和配置这些数据。

Listview生成器(垂直滚动)嵌套在Pageview builder(水平滚动)中，我已经配置了这个

要展示的东西是这样的

页面 第16号>>命令第16号命令第1项命令第16号命令第2项 第18号>>命令第18项第1项命令第18项第2项命令第18项第3项命令

我是学习JSON在颤振，请指导我应该如何获取数据和使用上述配置的需要。

{
    "error": "false",
    "content": [
        {
            "comp_code": "4",
            "comp_name": "KMT OVERSEAS",
            "order_no": "16",
            "soh_pk": "23660",
            "order_items": [
                {
                    "comp_code": "4",
                    "comp_name": "KMT OVERSEAS",
                    "order_no": "16",
                    "sod_pk": "31689",
                },
                {
                    "comp_code": "4",
                    "comp_name": "KMT OVERSEAS",
                    "order_no": "16",
                    "sod_pk": "31688",
                }
            ]
        },
        {
            "comp_code": "4",
            "comp_name": "KMT OVERSEAS",
            "order_no": "18",
            "soh_pk": "23702",
            "order_items": [
                {
                    "comp_code": "4",
                    "comp_name": "KMT OVERSEAS",
                    "order_no": "18",
                    "sod_pk": "31749",
                },
                {
                    "comp_code": "4",
                    "comp_name": "KMT OVERSEAS",
                    "order_no": "18",
                    "sod_pk": "31742",

                },
                {
                    "comp_code": "4",
                    "comp_name": "KMT OVERSEAS",
                    "order_no": "18",
                    "sod_pk": "31743",
                },
               
            ]
        }
    ]
}

Answer 1

要从服务器获取JSON：

1. 添加Http包。
2. 使用Http包发出网络请求。
3. 将响应转换为列表
4. 将此工作转移到单独的隔离区。

有关更多信息，请访问这链接

Answer 2

您必须遵循以下步骤并将给定的代码自定义为您自己的代码：

1将该插件放在pubspec.yaml文件http: ^0.12.0+4中

2导入'package:http/http.dart‘作为http；//我在下面使用的http；//可以更改它

3构建一个函数来获取数据：

  Future<Map> getNews() async {
  String apiurl = "https://your url/";
  http.Response response = await http.get(apiurl);
  return json.decode(response.body);
}

4 delare映射变量

Map data;

5调用异步方法中的函数，如：

// Future<void> main() async {} you can call inside  initstate or any custom function 
 data = await getNews();

现在json数据在data中，您可以任意使用它。6在listview.builder中使用，如下所示

new Center(
        child: new ListView.builder(
            itemCount: data.length,
            padding: EdgeInsets.all(8.0),
            itemBuilder: (BuildContext context, int position) {
              return new ListTile(
//here posts and title are json variables that are in json file
                title: new Text("${data["posts"][position]["title"]}"),
                subtitle: new Text(
                  parseHtmlString("${data["posts"][position]["content"]}"),
                  maxLines: 18,
                ),
              );
            }),
      ),