首页 > 解决方案 > Flutter does not read the name of the Json matrix

问题描述

I'm new to flutter and I can't solve a problem.

I have a database that gives me a Json like this

{
    "data": [
        {
            "id": “1”,
            “color”: “Black”,
            “Status”: "1"
        },
        {
            "id": “2”,
            “color”: “Green”,
            “Status”: "1"
        },
        {
            "id": “3”,
            “color”: “Blue”,
            “Status”: “0”
        }
    ]
}

What I'm trying to do is get the data on a listview and show it.

The problem is that the data is not shown, I cannot understand how to pass the matrix name on flutter.

If I remove the name of the "data" matrix from the JSON then the data is shown successfully.

But what I need is to get the data with the JSON that has the matrix name.

Does anyone know how to help me understand what I can do?

I thank you for your help and time.

Main.dart

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

void main() => runApp(new MyApp());

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

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {

  Future<List<User>> _getUsers() async {

    var data = await http.get("http://simone.fabriziolerose.it/index.php/Hello/dispdataflutter");

    var jsonData = json.decode(data.body);

    List<User> users = [];

    for(var u in jsonData){

      User user = User(u["id"], u["testo"], u["stato"]);

      users.add(user);

    }

    print(users.length);

    return users;

  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: Container(
        child: FutureBuilder(
          future: _getUsers(),
          builder: (BuildContext context, AsyncSnapshot snapshot){
            print(snapshot.data);
            if(snapshot.data == null){
              return Container(
                  child: Center(
                      child: Text("Loading...")
                  )
              );
            } else {
              return ListView.builder(
                itemCount: snapshot.data.length,
                itemBuilder: (BuildContext context, int index) {
                  return ListTile(
                    leading: CircleAvatar(
                      backgroundImage: NetworkImage(
                          snapshot.data[index].picture
                      ),
                    ),
                    title: Text(snapshot.data[index].name),
                    subtitle: Text(snapshot.data[index].email),
                    onTap: (){

                      Navigator.push(context,
                          new MaterialPageRoute(builder: (context) => DetailPage(snapshot.data[index]))
                      );

                    },
                  );
                },
              );
            }
          },
        ),
      ),
    );
  }
}

class DetailPage extends StatelessWidget {

  final User user;

  DetailPage(this.user);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(user.name),
        )
    );
  }
}


class User {

  final String name;
  final String email;
  final String picture;

  User(this.name, this.email, this.picture);

}

标签: jsonflutterdart

解决方案


您正在迭代 Map,您必须迭代 Map 内的 List:

    Future<List<User>> _getUsers() async {

        final data = await http.get("http://simone.fabriziolerose.it/index.php/Hello/dispdataflutter");

        final jsonData = Map.from(json.decode(data.body)); // Make sure you are getting Map, instead Linked, Hashed, Serialized data

        List<User> users = [];

        for(var u in jsonData['data']){ // That was the error

            User user = User(u["id"], u["testo"], u["stato"]);

            users.add(user);

        }

        print(users.length);

        return users;

    }

还要确保,如示例中所示,您正在Map使用方法获取类型Map.from


推荐阅读