Json parsing in dart (flutter)

问题

I'm new to Flutter and doesn't know much about complex json parsing. I've consulted few online articles but didn't find any suitable solution. My json is as follows

{
    "EmployeeName":"EmployeeName",
    "Incidents" : [
        {
            "Id":"1",
            "Text":"Text",
            "Photos":[
                {
                    "PhotoUrl" : "http://myphoto.com"
                },
                {
                    "PhotoUrl" : "http://myphoto.com"
                }
            ],
            "Notes" : [
                {
                    "Note":"Note"
                },
                {
                    "Note":"Note"
                }
            ]
        }
    ]
}

Any help would be great.

回答1:

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:sample_project_for_api/Employee.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _isLoading = false;

  List<Employee> emp = new List();
  @override
  void initState() {
    super.initState();
    getEmployeeDetails();
  }

  Future<String> loadPersonFromAssets() async {
    return await rootBundle.loadString('json/parse.json');
  }

  getEmployeeDetails() async {
    setState(() {
      _isLoading = true;
    });

    String jsonString = await loadPersonFromAssets();
    final employee = employeeFromJson(jsonString);
    emp.add(employee);
    print('This is the employee name : ${employee.employeeName}');
    for (int i = 0; i < employee.incidents.length; i++) {
      print('This is the employee id ${employee.incidents[i].id}');
      print('This is the employee text ${employee.incidents[i].text}');
    }
    for (int i = 0; i < employee.incidents.length; i++) {
      for (int j = 0; j < employee.incidents[i].notes.length; j++) {
        print('This are the notes : ${employee.incidents[i].notes[j].note}');
      }
    }
    setState(() {
      _isLoading = false;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
      body: _isLoading == true
          ? CircularProgressIndicator()
          : Container(
              child: ListView.builder(
                itemCount: emp.length,
                itemBuilder: (context, i) {

                  return Card(
                    child: Column(
                      children: <Widget>[
                        Text(emp[i].employeeName),
                        Text(emp[i].incidents[0].id),
                        Text(emp[i].incidents[0].notes[0].note),
                      ],
                    ),
                  );
                },
              ),
            ),
    ));
  }
}

check out the JSON that you want to parse, I have given you simple logic, its on you how you parse.



import 'dart:convert';

Employee employeeFromJson(String str) => Employee.fromJson(json.decode(str));

String employeeToJson(Employee data) => json.encode(data.toJson());

class Employee {
    String employeeName;
    List<Incident> incidents;

    Employee({
        this.employeeName,
        this.incidents,
    });

    factory Employee.fromJson(Map<String, dynamic> json) => Employee(
        employeeName: json["EmployeeName"],
        incidents: List<Incident>.from(json["Incidents"].map((x) => Incident.fromJson(x))),
    );

    Map<String, dynamic> toJson() => {
        "EmployeeName": employeeName,
        "Incidents": List<dynamic>.from(incidents.map((x) => x.toJson())),
    };
}

class Incident {
    String id;
    String text;
    List<Photo> photos;
    List<Note> notes;

    Incident({
        this.id,
        this.text,
        this.photos,
        this.notes,
    });

    factory Incident.fromJson(Map<String, dynamic> json) => Incident(
        id: json["Id"],
        text: json["Text"],
        photos: List<Photo>.from(json["Photos"].map((x) => Photo.fromJson(x))),
        notes: List<Note>.from(json["Notes"].map((x) => Note.fromJson(x))),
    );

    Map<String, dynamic> toJson() => {
        "Id": id,
        "Text": text,
        "Photos": List<dynamic>.from(photos.map((x) => x.toJson())),
        "Notes": List<dynamic>.from(notes.map((x) => x.toJson())),
    };
}

class Note {
    String note;

    Note({
        this.note,
    });

    factory Note.fromJson(Map<String, dynamic> json) => Note(
        note: json["Note"],
    );

    Map<String, dynamic> toJson() => {
        "Note": note,
    };
}

class Photo {
    String photoUrl;

    Photo({
        this.photoUrl,
    });

    factory Photo.fromJson(Map<String, dynamic> json) => Photo(
        photoUrl: json["PhotoUrl"],
    );

    Map<String, dynamic> toJson() => {
        "PhotoUrl": photoUrl,
    };
}

check out the model for parsing. And declared your json in a file for parsing as you described above.

this is the Final output :

I/flutter (23844): This is the employee name : EmployeeName
I/flutter (23844): This is the employee id 1
I/flutter (23844): This is the employee text Text
I/flutter (23844): This are the notes : Note
I/flutter (23844): This are the notes : Note

Now its on you how you use it in your view

回答2:

here is a Code example for your json:

employee

class Employee{

String employeeName;
List<Incident> incidents;

Employee({this.employeeName, this.incidents});

Employee.fromJson(Map<String, dynamic> json) {
    employeeName = json['employeeName'];
    if (json['incidents'] != null) {
        incidents = new List<Incident>();
        json['incidents'].forEach((v) {
            incidents.add(new Incident.fromJson(v));
        });
    }
}

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

incident

class Incident{

String id;
String text;
List<Photo> photos;
List<Note> notes;

Incident({this.id, this.text, this.photos, this.notes});

Incident.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    text = json['text'];
    if (json['photos'] != null) {
        photos = new List<Photo>();
        json['photos'].forEach((v) {
            photos.add(new Photo.fromJson(v));
        });
    }
    if (json['notes'] != null) {
        notes = new List<Note>();
        json['notes'].forEach((v) {
            notes.add(new Note.fromJson(v));
        });
    }
}

Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.id != null) data['id'] = this.id;
    if (this.text != null) data['text'] = this.text;
    if (this.photos != null) {
        data['photos'] = this.photos.map((v) => v.toJson()).toList();
    }
    if (this.notes != null) {
        data['notes'] = this.notes.map((v) => v.toJson()).toList();
    }
    return data;
}
}

note

class Note{

String note;

Note({this.note});

Note.fromJson(Map<String, dynamic> json) {
    note = json['note'];
}

Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.note != null) data['note'] = this.note;
    return data;
}
}

photo

class Photo{

String photoUrl;

Photo({this.photoUrl});

Photo.fromJson(Map<String, dynamic> json) {
    photoUrl = json['photoUrl'];
}

Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.photoUrl != null) data['photoUrl'] = this.photoUrl;
    return data;
}
}

来源：https://stackoverflow.com/questions/59736381/json-parsing-in-dart-flutter

标签

json

Flutter

dart