卡在 json 中

Question

我不知道问题是因为在调试时没有错误信息，但是当我打印 info.lenght[ 时 json 的值为空=21=]

class _HomePageState extends State<HomePage> { List info = []; _initData(){ DefaultAssetBundle.of(context).loadString("json/info.json").then((value){ info = jsonDecode(value); }); } @override void iniState(){ super.initState(); _initData(); }

下面是我在 json/info 中的 json 代码。json

[ { "title": "Glue", "img": "assets/ex1.png" }, { "title": "Abs", "img": "assets/ex2.png" }, { "title": "Legs", "img": "assets/ex3.png" }, { "title": "Arms", "img": "assets/ex4.png" } ]

以及如何在 dart 中打印 json 的 img 和 title 值？

Answer 1

您必须先为您的 json 响应创建一个模型 class。

// To parse this JSON data, do
//
//     final jsonModel = jsonModelFromJson(jsonString);

import 'dart:convert';

List<JsonModel> jsonModelFromJson(String str) => List<JsonModel>.from(json.decode(str).map((x) => JsonModel.fromJson(x)));

String jsonModelToJson(List<JsonModel> data) => json.encode(List<dynamic>.from(data.map((x) => x.toJson())));

class JsonModel {
    JsonModel({
        this.title,
        this.img,
    });

    String title;
    String img;

    factory JsonModel.fromJson(Map<String, dynamic> json) => JsonModel(
        title: json["title"] == null ? null : json["title"],
        img: json["img"] == null ? null : json["img"],
    );

    Map<String, dynamic> toJson() => {
        "title": title == null ? null : title,
        "img": img == null ? null : img,
    };
}

然后只需使用此模型 class 即可解码您的 json 文件。

var result = JsonModel.fromJson(jsonResponse);

稍后，您可以使用 result.title 或 result.img 获取数据

Answer 2

您必须将 json 文件添加到 pubspec.yaml 文件中。

 flutter:
   assets:
     - json/info.json

在加载页面视图之前，您应该从 json 文件加载值并在 initState 中分配一个列表。之后，您可以通过 [index][header].

使用列表作为地图

class JsonResult extends StatefulWidget {
   const JsonResult({Key? key}) : super(key: key);

   @override
   _JsonResultState createState() => _JsonResultState();
}

class _JsonResultState extends State<JsonResult> {
  var jsonList = [];
  @override
  void initState() {
    rootBundle.loadString("json/info.json").then((value) {
      jsonList = json.decode(value);
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ListView.builder(
          itemBuilder: (context, index) {
            return ListTile(
              leading: Image.asset(jsonList[index]["img"]),
              title: Text(jsonList[index]["title"]),
            );
          },
          itemCount: jsonList.length,
        ),
      ),
    );
  }
}

卡在 json 中

Stuck with json in flutter

json

flutter

flutter-layout