需要帮助解析 json 来颤动

Question

大家好，我正在尝试学习flutter，我想在应用程序中显示json信息，但我正在努力获取一些信息。

这是我目前拥有的。

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:dio/dio.dart';

void main() {
  runApp(new MaterialApp(
    home: new HomePage(),
  ));
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  Future<void> _getFutureDados() async {
    Uri url = Uri.parse('https://fortnite-api.com/v2/shop/br');

    Response response = await Dio().request(url.toString());

    List<ItemLoja> itensLoja = List<ItemLoja>();
    for (Map<String, dynamic> item in response.data['data']['featured']) {
      itensLoja.add(ItemLoja.fromJson(item));
    }

    @override
    void initState() {
      super.initState();
      _getFutureDados();
    }
  }

  @override
  Widget build(BuildContext context) {
    _getFutureDados();
    return Scaffold(
        body: ListView.builder(
      itemCount: response.data == null ? 0 : response.data.length,
      itemBuilder: (context, index) {
        final item = response.data[index];
        Text(item.name);
      },
    ));
  }
}

class ItemLoja {
  final String id;
  final String name;

  ItemLoja({
    this.id,
    this.name,
  });

  ItemLoja.fromJson(Map<String, dynamic> jsonData)
      : id = jsonData['id'],
        name = jsonData['name'];
}

我可以设法在终端打印 json，但不能在应用程序内打印。用 forEach 做这样的事情是不可能的吗？ 在 php 中，我可以设法做到这一点，这很容易，通过使用 ($item[name]) 获取名称，然后将其放在我想要的位置。

感谢您的帮助。 对不起，我的英语不是我的主要语言。

Answer 1

您可以在下面复制粘贴运行完整代码
第一步：可以使用Payload.fromJson(response.data)，详情见完整代码
第 2 步：使用 FutureBuilder 显示并嵌套 ListView
代码sn-p

Future<Payload> _getFutureDados() async {
    Uri url = Uri.parse('https://fortnite-api.com/v2/shop/br');

    Response response = await Dio().request(url.toString());
    if (response.statusCode == 200) {
      return Payload.fromJson(response.data);
    } else {
      throw Exception;
    }
  }
...
return ListView.separated(
        separatorBuilder: (BuildContext context, int index) {
          return SizedBox(
            height: 10,
          );
        },
        shrinkWrap: true,
        itemCount: snapshot.data.data.featured.entries.length,
        itemBuilder: (context, index) {
          var entries = snapshot.data.data.featured.entries;
          return Column(
            children: [
              Text("price ${entries[index].regularPrice.toString()}"),
              ListView.builder(
                  shrinkWrap: true,
                  physics: NeverScrollableScrollPhysics(),

工作演示

完整代码

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'dart:convert';

Payload payloadFromJson(String str) => Payload.fromJson(json.decode(str));

String payloadToJson(Payload data) => json.encode(data.toJson());

class Payload {
  Payload({
    this.status,
    this.data,
  });

  int status;
  Data data;

  factory Payload.fromJson(Map<String, dynamic> json) => Payload(
        status: json["status"],
        data: Data.fromJson(json["data"]),
      );

  Map<String, dynamic> toJson() => {
        "status": status,
        "data": data.toJson(),
      };
}

class Data {
  Data({
    this.hash,
    this.date,
    this.featured,
    this.daily,
    this.specialFeatured,
    this.specialDaily,
    this.votes,
    this.voteWinners,
  });

  String hash;
  DateTime date;
  Daily featured;
  Daily daily;
  Daily specialFeatured;
  dynamic specialDaily;
  dynamic votes;
  dynamic voteWinners;

  factory Data.fromJson(Map<String, dynamic> json) => Data(
        hash: json["hash"],
        date: DateTime.parse(json["date"]),
        featured: Daily.fromJson(json["featured"]),
        daily: Daily.fromJson(json["daily"]),
        specialFeatured: Daily.fromJson(json["specialFeatured"]),
        specialDaily: json["specialDaily"],
        votes: json["votes"],
        voteWinners: json["voteWinners"],
      );

  Map<String, dynamic> toJson() => {
        "hash": hash,
        "date": date.toIso8601String(),
        "featured": featured.toJson(),
        "daily": daily.toJson(),
        "specialFeatured": specialFeatured.toJson(),
        "specialDaily": specialDaily,
        "votes": votes,
        "voteWinners": voteWinners,
      };
}

class Daily {
  Daily({
    this.name,
    this.entries,
  });

  String name;
  List<Entry> entries;

  factory Daily.fromJson(Map<String, dynamic> json) => Daily(
        name: json["name"],
        entries:
            List<Entry>.from(json["entries"].map((x) => Entry.fromJson(x))),
      );

  Map<String, dynamic> toJson() => {
        "name": name,
        "entries": List<dynamic>.from(entries.map((x) => x.toJson())),
      };
}

class Entry {
  Entry({
    this.regularPrice,
    this.finalPrice,
    this.bundle,
    this.banner,
    this.giftable,
    this.refundable,
    this.sortPriority,
    this.categories,
    this.devName,
    this.offerId,
    this.displayAssetPath,
    this.newDisplayAssetPath,
    this.items,
  });

  int regularPrice;
  int finalPrice;
  dynamic bundle;
  Banner banner;
  bool giftable;
  bool refundable;
  int sortPriority;
  List<String> categories;
  String devName;
  String offerId;
  String displayAssetPath;
  String newDisplayAssetPath;
  List<ItemLoja> items;

  factory Entry.fromJson(Map<String, dynamic> json) => Entry(
        regularPrice: json["regularPrice"],
        finalPrice: json["finalPrice"],
        bundle: json["bundle"],
        banner: json["banner"] == null ? null : Banner.fromJson(json["banner"]),
        giftable: json["giftable"],
        refundable: json["refundable"],
        sortPriority: json["sortPriority"],
        categories: List<String>.from(json["categories"].map((x) => x)),
        devName: json["devName"],
        offerId: json["offerId"],
        displayAssetPath:
            json["displayAssetPath"] == null ? null : json["displayAssetPath"],
        newDisplayAssetPath: json["newDisplayAssetPath"] == null
            ? null
            : json["newDisplayAssetPath"],
        items:
            List<ItemLoja>.from(json["items"].map((x) => ItemLoja.fromJson(x))),
      );

  Map<String, dynamic> toJson() => {
        "regularPrice": regularPrice,
        "finalPrice": finalPrice,
        "bundle": bundle,
        "banner": banner == null ? null : banner.toJson(),
        "giftable": giftable,
        "refundable": refundable,
        "sortPriority": sortPriority,
        "categories": List<dynamic>.from(categories.map((x) => x)),
        "devName": devName,
        "offerId": offerId,
        "displayAssetPath": displayAssetPath == null ? null : displayAssetPath,
        "newDisplayAssetPath":
            newDisplayAssetPath == null ? null : newDisplayAssetPath,
        "items": List<dynamic>.from(items.map((x) => x.toJson())),
      };
}

class Banner {
  Banner({
    this.value,
    this.backendValue,
  });

  String value;
  String backendValue;

  factory Banner.fromJson(Map<String, dynamic> json) => Banner(
        value: json["value"],
        backendValue: json["backendValue"],
      );

  Map<String, dynamic> toJson() => {
        "value": value,
        "backendValue": backendValue,
      };
}

class ItemLoja {
  ItemLoja({
    this.id,
    this.name,
    this.description,
    this.type,
    this.rarity,
    this.series,
    this.itemSet,
    this.introduction,
    this.images,
    this.variants,
    this.gameplayTags,
    this.showcaseVideo,
    this.displayAssetPath,
    this.definitionPath,
    this.path,
    this.added,
    this.shopHistory,
  });

  String id;
  String name;
  String description;
  Rarity type;
  Rarity rarity;
  Series series;
  Set itemSet;
  Introduction introduction;
  Images images;
  List<Variant> variants;
  List<String> gameplayTags;
  String showcaseVideo;
  String displayAssetPath;
  String definitionPath;
  String path;
  DateTime added;
  List<DateTime> shopHistory;

  factory ItemLoja.fromJson(Map<String, dynamic> json) => ItemLoja(
        id: json["id"],
        name: json["name"],
        description: json["description"],
        type: Rarity.fromJson(json["type"]),
        rarity: Rarity.fromJson(json["rarity"]),
        series: json["series"] == null ? null : Series.fromJson(json["series"]),
        itemSet: json["set"] == null ? null : Set.fromJson(json["set"]),
        introduction: Introduction.fromJson(json["introduction"]),
        images: Images.fromJson(json["images"]),
        variants: json["variants"] == null
            ? null
            : List<Variant>.from(
                json["variants"].map((x) => Variant.fromJson(x))),
        gameplayTags: List<String>.from(json["gameplayTags"].map((x) => x)),
        showcaseVideo:
            json["showcaseVideo"] == null ? null : json["showcaseVideo"],
        displayAssetPath:
            json["displayAssetPath"] == null ? null : json["displayAssetPath"],
        definitionPath:
            json["definitionPath"] == null ? null : json["definitionPath"],
        path: json["path"],
        added: DateTime.parse(json["added"]),
        shopHistory: List<DateTime>.from(
            json["shopHistory"].map((x) => DateTime.parse(x))),
      );

  Map<String, dynamic> toJson() => {
        "id": id,
        "name": name,
        "description": description,
        "type": type.toJson(),
        "rarity": rarity.toJson(),
        "series": series == null ? null : series.toJson(),
        "set": itemSet == null ? null : itemSet.toJson(),
        "introduction": introduction.toJson(),
        "images": images.toJson(),
        "variants": variants == null
            ? null
            : List<dynamic>.from(variants.map((x) => x.toJson())),
        "gameplayTags": List<dynamic>.from(gameplayTags.map((x) => x)),
        "showcaseVideo": showcaseVideo == null ? null : showcaseVideo,
        "displayAssetPath": displayAssetPath == null ? null : displayAssetPath,
        "definitionPath": definitionPath == null ? null : definitionPath,
        "path": path,
        "added": added.toIso8601String(),
        "shopHistory":
            List<dynamic>.from(shopHistory.map((x) => x.toIso8601String())),
      };
}

class Images {
  Images({
    this.smallIcon,
    this.icon,
    this.featured,
    this.other,
  });

  String smallIcon;
  String icon;
  String featured;
  dynamic other;

  factory Images.fromJson(Map<String, dynamic> json) => Images(
        smallIcon: json["smallIcon"],
        icon: json["icon"],
        featured: json["featured"] == null ? null : json["featured"],
        other: json["other"],
      );

  Map<String, dynamic> toJson() => {
        "smallIcon": smallIcon,
        "icon": icon,
        "featured": featured == null ? null : featured,
        "other": other,
      };
}

class Introduction {
  Introduction({
    this.chapter,
    this.season,
    this.text,
    this.backendValue,
  });

  String chapter;
  String season;
  TextEnum text;
  int backendValue;

  factory Introduction.fromJson(Map<String, dynamic> json) => Introduction(
        chapter: json["chapter"],
        season: json["season"],
        text: textValues.map[json["text"]],
        backendValue: json["backendValue"],
      );

  Map<String, dynamic> toJson() => {
        "chapter": chapter,
        "season": season,
        "text": textValues.reverse[text],
        "backendValue": backendValue,
      };
}

enum TextEnum {
  INTRODUCED_IN_CHAPTER_1_SEASON_5,
  INTRODUCED_IN_CHAPTER_2_SEASON_2,
  INTRODUCED_IN_CHAPTER_2_SEASON_4,
  INTRODUCED_IN_CHAPTER_1_SEASON_6,
  INTRODUCED_IN_CHAPTER_1_SEASON_9,
  INTRODUCED_IN_CHAPTER_2_SEASON_3,
  INTRODUCED_IN_CHAPTER_2_SEASON_1
}

final textValues = EnumValues({
  "Introduced in Chapter 1, Season 5.":
      TextEnum.INTRODUCED_IN_CHAPTER_1_SEASON_5,
  "Introduced in Chapter 1, Season 6.":
      TextEnum.INTRODUCED_IN_CHAPTER_1_SEASON_6,
  "Introduced in Chapter 1, Season 9.":
      TextEnum.INTRODUCED_IN_CHAPTER_1_SEASON_9,
  "Introduced in Chapter 2, Season 1.":
      TextEnum.INTRODUCED_IN_CHAPTER_2_SEASON_1,
  "Introduced in Chapter 2, Season 2.":
      TextEnum.INTRODUCED_IN_CHAPTER_2_SEASON_2,
  "Introduced in Chapter 2, Season 3.":
      TextEnum.INTRODUCED_IN_CHAPTER_2_SEASON_3,
  "Introduced in Chapter 2, Season 4.":
      TextEnum.INTRODUCED_IN_CHAPTER_2_SEASON_4
});

class Set {
  Set({
    this.value,
    this.text,
    this.backendValue,
  });

  String value;
  String text;
  String backendValue;

  factory Set.fromJson(Map<String, dynamic> json) => Set(
        value: json["value"],
        text: json["text"],
        backendValue: json["backendValue"],
      );

  Map<String, dynamic> toJson() => {
        "value": value,
        "text": text,
        "backendValue": backendValue,
      };
}

class Rarity {
  Rarity({
    this.value,
    this.displayValue,
    this.backendValue,
  });

  String value;
  String displayValue;
  BackendValue backendValue;

  factory Rarity.fromJson(Map<String, dynamic> json) => Rarity(
        value: json["value"],
        displayValue: json["displayValue"],
        backendValue: backendValueValues.map[json["backendValue"]],
      );

  Map<String, dynamic> toJson() => {
        "value": value,
        "displayValue": displayValue,
        "backendValue": backendValueValues.reverse[backendValue],
      };
}

enum BackendValue {
  E_FORT_RARITY_LEGENDARY,
  E_FORT_RARITY_RARE,
  E_FORT_RARITY_UNCOMMON,
  ATHENA_CHARACTER,
  ATHENA_BACKPACK,
  ATHENA_DANCE,
  ATHENA_ITEM_WRAP,
  E_FORT_RARITY_EPIC,
  ATHENA_PICKAXE,
  ATHENA_GLIDER
}

final backendValueValues = EnumValues({
  "AthenaBackpack": BackendValue.ATHENA_BACKPACK,
  "AthenaCharacter": BackendValue.ATHENA_CHARACTER,
  "AthenaDance": BackendValue.ATHENA_DANCE,
  "AthenaGlider": BackendValue.ATHENA_GLIDER,
  "AthenaItemWrap": BackendValue.ATHENA_ITEM_WRAP,
  "AthenaPickaxe": BackendValue.ATHENA_PICKAXE,
  "EFortRarity::Epic": BackendValue.E_FORT_RARITY_EPIC,
  "EFortRarity::Legendary": BackendValue.E_FORT_RARITY_LEGENDARY,
  "EFortRarity::Rare": BackendValue.E_FORT_RARITY_RARE,
  "EFortRarity::Uncommon": BackendValue.E_FORT_RARITY_UNCOMMON
});

class Series {
  Series({
    this.value,
    this.image,
    this.backendValue,
  });

  String value;
  String image;
  String backendValue;

  factory Series.fromJson(Map<String, dynamic> json) => Series(
        value: json["value"],
        image: json["image"],
        backendValue: json["backendValue"],
      );

  Map<String, dynamic> toJson() => {
        "value": value,
        "image": image,
        "backendValue": backendValue,
      };
}

class Variant {
  Variant({
    this.channel,
    this.type,
    this.options,
  });

  String channel;
  String type;
  List<Option> options;

  factory Variant.fromJson(Map<String, dynamic> json) => Variant(
        channel: json["channel"],
        type: json["type"],
        options:
            List<Option>.from(json["options"].map((x) => Option.fromJson(x))),
      );

  Map<String, dynamic> toJson() => {
        "channel": channel,
        "type": type,
        "options": List<dynamic>.from(options.map((x) => x.toJson())),
      };
}

class Option {
  Option({
    this.tag,
    this.name,
    this.unlockRequirements,
    this.image,
  });

  String tag;
  String name;
  dynamic unlockRequirements;
  String image;

  factory Option.fromJson(Map<String, dynamic> json) => Option(
        tag: json["tag"],
        name: json["name"],
        unlockRequirements: json["unlockRequirements"],
        image: json["image"],
      );

  Map<String, dynamic> toJson() => {
        "tag": tag,
        "name": name,
        "unlockRequirements": unlockRequirements,
        "image": image,
      };
}

class EnumValues<T> {
  Map<String, T> map;
  Map<T, String> reverseMap;

  EnumValues(this.map);

  Map<T, String> get reverse {
    if (reverseMap == null) {
      reverseMap = map.map((k, v) => new MapEntry(v, k));
    }
    return reverseMap;
  }
}

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  Future<Payload> _future;

  Future<Payload> _getFutureDados() async {
    Uri url = Uri.parse('https://fortnite-api.com/v2/shop/br');

    Response response = await Dio().request(url.toString());
    if (response.statusCode == 200) {
      return Payload.fromJson(response.data);
    } else {
      throw Exception;
    }
  }

  @override
  void initState() {
    _future = _getFutureDados();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: FutureBuilder(
            future: _future,
            builder: (context, AsyncSnapshot<Payload> snapshot) {
              switch (snapshot.connectionState) {
                case ConnectionState.none:
                  return Text('none');
                case ConnectionState.waiting:
                  return Center(child: CircularProgressIndicator());
                case ConnectionState.active:
                  return Text('');
                case ConnectionState.done:
                  if (snapshot.hasError) {
                    return Text(
                      '${snapshot.error}',
                      style: TextStyle(color: Colors.red),
                    );
                  } else {
                    return ListView.separated(
                        separatorBuilder: (BuildContext context, int index) {
                          return SizedBox(
                            height: 10,
                          );
                        },
                        shrinkWrap: true,
                        itemCount: snapshot.data.data.featured.entries.length,
                        itemBuilder: (context, index) {
                          var entries = snapshot.data.data.featured.entries;
                          return Column(
                            children: [
                              Text("price ${entries[index].regularPrice.toString()}"),
                              ListView.builder(
                                  shrinkWrap: true,
                                  physics: NeverScrollableScrollPhysics(),
                                  itemCount: entries[index].items.length,
                                  itemBuilder: (context, index1) {
                                    return Card(
                                        elevation: 6.0,
                                        child: Padding(
                                          padding: const EdgeInsets.only(
                                              top: 6.0,
                                              bottom: 6.0,
                                              left: 8.0,
                                              right: 8.0),
                                          child: Row(
                                            crossAxisAlignment:
                                                CrossAxisAlignment.start,
                                            children: <Widget>[
                                              Text("name: ${entries[index].items[index1].name}"),
                                             /* Spacer(),
                                              Text(
                                                "id ${entries[index].items[index1].id}",
                                              ),*/
                                            ],
                                          ),
                                        ));
                                  }),
                            ],
                          );
                        });
                  }
              }
            }));
  }
}

Answer 2

我认为您需要找到一些方法来处理您的请求并显示结果。

您的代码需要一些调整，但离您的目标并不远。

解决此问题的一种方法是使用FutureBuilder。

在这种情况下，您可以使用 FutureBuider 在未来请求到达时显示 Listview。

按照本教程，他们将使用您需要的工具：Future Builder with List View Builder