Flutter：如何解析多数组 JSON

ike13 发表于 Dev

ike13

我有一个 JSON 数组 - https://jsonplaceholder.typicode.com/users和我的代码

  final String apiURL = 'https://jsonplaceholder.typicode.com/users';

  Future<List<GetUsers>> fetchJSONData() async {

    var jsonResponse = await http.get(apiURL);


    if (jsonResponse.statusCode == 200) {

      final jsonItems = json.decode(jsonResponse.body).cast<Map<String, dynamic>>();
      print(jsonItems);

      List<GetUsers> usersList = jsonItems.map<GetUsers>((json) {
        return GetUsers.fromJson(json);
      }).toList();

      return usersList;

    } else {
      throw Exception('Failed to load data from internet');
    }
  }

我如何解析

"address": { "street": "Kulas Light", "suite": "Apt. 556", "city": "Gwenborough", "zipcode": "92998-3874", "geo": { "lat": "-37.3159", "lng": "81.1496" } },

街道和城市

并将其输出到ListTile 我只知道如何输出数组的第一级，但我不明白如何解析第二级

克坦·拉姆特克

假设您想获取第一个用户的街道名称，那么您可以通过

usersList[0]["address"]["street"]

这是完整的示例：


import "package:flutter/material.dart";
import "dart:convert";
import "package:http/http.dart" as http;

class JsonMultyParse extends StatefulWidget {
  @override
  _JsonMultyParseState createState() => _JsonMultyParseState();
}

class _JsonMultyParseState extends State<JsonMultyParse> {
  final String apiURL = 'https://jsonplaceholder.typicode.com/users';
  List<dynamic> users = [];
  void fetchJSONData() async {
    var jsonResponse = await http.get(apiURL);

    if (jsonResponse.statusCode == 200) {
      final jsonItems =
          json.decode(jsonResponse.body).cast<Map<String, dynamic>>();
      print(jsonItems[0]["address"]["street"]);
      setState(() {
        users = jsonItems;
      });

      for (dynamic user in users) {
        print(user["address"]["street"]);
      }
    } else {
      throw Exception('Failed to load data from internet');
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        debugShowCheckedModeBanner: false,
        home: Scaffold(
          body: Container(
            child: Column(
              children: <Widget>[
                SizedBox(height: 20),
                RaisedButton(
                  onPressed: fetchJSONData,
                  child: Text("Fetch Data"),
                ),
                Expanded(
                  child: ListView.builder(
                      itemCount: users.length,
                      itemBuilder: (context, index) {
                        return Card(
                          child: Container(
                            height: 50,
                            padding: const EdgeInsets.all(8.0),
                            child: Text(
                              users[index]["address"]["street"],
                            ),
                          ),
                        );
                      }),
                )
              ],
            ),
          ),
        ));
  }
}

输出：