2

我有以下从服务器获取的 JSON 数据,我需要在 pageviewbuilder 以及 Flutter 应用程序中的 listview builder 中获取和配置这些数据。

Listview builder(垂直滚动)嵌套在 Pageview builder(水平滚动)中,我已经配置了

要展示的东西是这样的

页面 ---------- 订购商品

订单 16 >> 订单 16,项目 1 ,订单 16 项目 2

订单 18 >> 订单 18,项目 1,订单 18,项目 2,订单 18,项目 3

我是在flutter中学习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",
                },
               
            ]
        }
    ]
}
4

2 回答 2

2

从服务器获取 JSON:

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

有关更多信息,请查看链接

于 2020-08-28T01:39:30.153 回答
1

您必须按照以下步骤自定义给定的代码为您自己的:

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

2将“包: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 dela一个Map变量

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,
                ),
              );
            }),
      ),
于 2020-08-28T06:24:13.947 回答