为什么我不能从 json 获取数据值 - 颤振

Question

我正在尝试使用颤振从我的 json 文件 categories.json 获取值，但总是出错或不显示，我真的不知道出了什么问题 这是我的 ma​​in.dart

 Future<List<Category>> loadData() async {
    String jString = await rootBundle.loadString("assets/categories.json");
    List<dynamic> jRes = jsonDecode(jString);
    List<Category> datas = jRes.map((e) => Category.fromJson(e)).toList();
    return datas;
  }


Container(
  child: FutureBuilder<List<Category>>(
      future: loadData(),
      builder: (context, data) {
        if (data.connectionState != ConnectionState.waiting &&
            data.hasData) {
          var userList = data.data;
          return ListView.builder(
              itemCount: userList.length,
              itemBuilder: (context, index) {
                var userData = userList[index];
                return Column(
                  children: [
                    Text("Category: ${userData.catName}"),
                  ],
                );
              });
        } else {
          return Center(
            child: CircularProgressIndicator(),
          );
        }
      })),

还有我的 model.dart

class Category {
  String catId;
  String catName;
  SubCategory subcat;

  Category({this.catId, this.catName, this.subcat});
  factory Category.fromJson(Map<String, dynamic> json) {
    return Category(
      catId: json['cat_id'],
      catName: json['category'],
      subcat: SubCategory.fromJson(json['cat_subcategory']),
    );
  }
  Map<String, dynamic> toJson() {
    return {
      "cat_id": catId,
      "category": catName,
    };
  }
}

class SubCategory {
  String subName, subImage;

  SubCategory({this.subName, this.subImage});
  factory SubCategory.fromJson(Map<String, dynamic> json) {
    return SubCategory(subName: json['sub_name'], subImage: json['sub_image']);
  }
  Map<String, dynamic> toJson() {
    return {
      "sub_name": subName,
      "sub_image": subImage,
    };
  }
}

最后是我的 categories.json 文件

[{
        "category": "Design & Creativity",
        "cat_id": "1",
        "cat_subcategory": [
            {
                "sub_name": "Ads",
                "sub_image": "https://images.unsplash.com/photo-1589838017489-9198a27bd040?ixid=MXwxMjA3fDB8MHxzZWFyY2h8Mnx8YWR2ZXJ0aXNlbWVudHxlbnwwfHwwfA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60"
            }
           
          
        ]
    }]

//There are more of them

我运行它时面临的问题是它只在我的 ma​​in.dart 中显示CircularProgressIndicator()，当我删除 if 语句 时，它说Another exception was thrown: NoSuchMethodError: The getter 'length' was called on null.请问我该如何解决这个问题，如果您需要更多解释，请告诉我

PS：当我检查loadData() 值时，它显示type 'List<dynamic>' is not a subtype of type 'Map<String, dynamic>'

编辑：谢谢大家的回答，但我所做的是使用这个网站生成一个模型model generator

我能够获得价值

Answer 1

就个人而言，当我想从 json 文件中加载数据时，我会这样做：

  Future<List<Category>> loadData() async {
    List<Category> datas = [];
    return rootBundle.loadString("assets/categories.json").then((value) {
      List<dynamic> jRes = jsonDecode(value);
      jRes.forEach((element) {
        datas.add(Category.fromJson(element));
      });
      return datas;
    });
  }

另外，在 SubCategory 类中

factory SubCategory.fromJson(Map<String, dynamic> json) {
    return SubCategory(subName: json['sub_name'], subImage: json['sub_image']);
  }

您的 fromJson() 需要 Map。

但是如果你查看你的文件

"cat_subcategory": [
            {
                "sub_name": "Ads",
                "sub_image": "https://images.unsplash.com/photo-1589838017489-9198a27bd040?ixid=MXwxMjA3fDB8MHxzZWFyY2h8Mnx8YWR2ZXJ0aXNlbWVudHxlbnwwfHwwfA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60"
            }
           
          
        ]

可以看到cat_subcategory是一个List

所以你给你的 SubCategory.fromJson() 一个列表而不是一个地图。 如果你想给出一个地图，你可以简单地给出你列表的第一个索引

你的 Category.fromJson() 变成了

factory Category.fromJson(Map<String, dynamic> json) {
    return Category(
      catId: json['cat_id'],
      catName: json['category'],
      subcat: SubCategory.fromJson(json['cat_subcategory'][0]),
    );
  }

Answer 2

更改你的 model.dart 类

class Category {
String category;
String catId;
List<CatSubcategory> catSubcategory;

Category({this.category, this.catId, this.catSubcategory});

Category.fromJson(Map<String, dynamic> json) {
category = json['category'];
catId = json['cat_id'];
if (json['cat_subcategory'] != null) {
  catSubcategory = new List<CatSubcategory>();
  json['cat_subcategory'].forEach((v) {
    catSubcategory.add(new CatSubcategory.fromJson(v));
  });
}}

Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['category'] = this.category;
data['cat_id'] = this.catId;
if (this.catSubcategory != null) {
  data['cat_subcategory'] =
      this.catSubcategory.map((v) => v.toJson()).toList();
}
return data;
}}

class CatSubcategory {
String subName;
String subImage;

CatSubcategory({this.subName, this.subImage});

CatSubcategory.fromJson(Map<String, dynamic> json) {
subName = json['sub_name'];
subImage = json['sub_image'];
}

Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['sub_name'] = this.subName;
data['sub_image'] = this.subImage;
return data;
}}

然后替换

List<Category> datas = jRes.map((e) => Category.fromJson(e)).toList();

与

List<Category> datas = List<Category>.from(jRes.map((category)=> Category.fromJson(category)));