pase 2 json阵列内部颤振

Question

你好，我是新来的，并试图用mysql db构建一个流畅的应用程序，问题是我有一个json响应，其中有两个对象，我想解析成一个小部件，而且我真的不知道如何使它们的类能够帮助我：

Json答复:

{
   "folders":[
      {
         "id":2531,
         "name":"MiniOSCE Ihsan",
         "img":null,
         "haschild":0,
         "parentid":1665,
         "createdate":"2019-11-26 12:21:27",
         "inarchive":0,
         "active":1
      }
   ],
   "files":[
      {
         "id":3669,
         "name":"Dermatology_Atlas.pdf 16.61MB",
         "img":null,
         "uploader":"admin",
         "url":"http:\/\/msc-mu.com\/..\/uploaded\/130620190Dermatology_Atlas.pdf",
         "createdate":"2019-06-13
23:54:41",
         "approved":0,
         "active":1
      },
      {
         "id":3670,
         "name":"Derma-\u062a\u0644\u062e\u064a\u0635.docx 27.88KB",
         "img":null,
         "uploader":"admin",
         "url":"http:\/\/msc-mu.com\/..\/uploaded\/130620190Derma-\u062a\u0644\u062e\u064a\u0635.docx",
         "createdate":"2019-06-13
23:54:41",
         "approved":0,
         "active":1
      },
      {
         "id":3671,
         "name":"ABC Dermatology and MiniOsce .pptx 67.43MB",
         "img":null,
         "uploader":"admin",
         "url":"http:\/\/msc-mu.com\/..\/uploaded\/130620190ABC Dermatology and MiniOsce .pptx",
         "createdate":"2019-06-13 23:54:41",
         "approved":0,
         "active":1
      },
      {
         "id":3672,
         "name":"Derma
1ry & 2ry skin lesions.pptx 2.02MB",
         "img":null,
         "uploader":"admin",
         "url":"http:\/\/msc-mu.com\/..\/uploaded\/130620190Derma 1ry & 2ry skin lesions.pptx",
         "createdate":"2019-06-13 23:54:41",
         "approved":0,
         "active":1
      },
      {
         "id":3673,
         "name":"Derma mini OSCE.docx
1.96MB",
         "img":null,
         "uploader":"admin",
         "url":"http:\/\/msc-mu.com\/..\/uploaded\/130620190Derma mini OSCE.docx",
         "createdate":"2019-06-13 23:54:41",
         "approved":0,
         "active":1
      },
      {
         "id":4955,
         "name":"immune 9 (8_9.3).m4a 45.66MB",
         "img":null,
         "uploader":"uploader18",
         "url":"http:\/\/msc-mu.com\/..\/uploaded\/231020190immune
9 (8_9.3).m4a",
         "createdate":"2019-10-23 12:01:36",
         "approved":0,
         "active":1
      }
   ]
}

我已经单独实现了文件夹列表和文件单独，如何做到这两个？并将它们转换为小部件。

这是我的文件小部件代码！以及文件夹的一些更改：

class ListViewFolders extends StatelessWidget {
  final List<Files> filesSubject;
  ListViewFolders(this.filesSubject);
  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemBuilder: (BuildContext context, int currentIndex) {
        return createFellowFolders(filesSubject[currentIndex], context);
      },
      itemCount: filesSubject.length,
    );
  }

  Widget createFellowFolders(Files files, BuildContext context) {
    String url = files.url;
    return Slidable(
      actionPane: SlidableDrawerActionPane(),
      actionExtentRatio: 0.25,
      child: Container(
        decoration: BoxDecoration(
            border: Border.all(width: 1), color: Colors.transparent.withOpacity(0.3)),
        child: ListTile(
          title: Text(
            files.name,
            style: TextStyle(color: Colors.white),
          ),
          subtitle: Text('Slide To View options',
              style: TextStyle(color: Colors.white)),
        ),
      ),
      actions: <Widget>[
        IconSlideAction(
          caption: 'Play',
          color: Colors.red,
          icon: FontAwesomeIcons.play,
          onTap: () {
            toast('coming soon');
          }
        ),
      ],
      secondaryActions: <Widget>[
        IconSlideAction(
          caption: 'Download',
          color: Colors.green,
          icon: Icons.arrow_circle_down,
          onTap: () async {
            final status = await Permission.storage.request();
            if (status.isGranted) {
              final externalDir = await getExternalStorageDirectory();
              final id = await FlutterDownloader.enqueue(
                  url: files.url,
                  savedDir: externalDir.path,
                  showNotification: true,
                  openFileFromNotification: true);
            } else {
              toast('Permission Denied');
            }
          },
        ),
        IconSlideAction(
          caption: 'Share',
          color: Colors.indigo,
          icon: Icons.share,
          onTap: () {
            Share.share(url);
          },
        ),
      ],
    );
  }
}

模型类：

import 'dart:core';

class YearsMain {
  final String id;
  final String name;


  const YearsMain({this.id, this.name});

  factory YearsMain.fromJson(Map<String, dynamic> jsonData) {
    return YearsMain(
      id: jsonData['id'].toString(),
      name: jsonData['name'],
    );
  }
}



class Folders {
   String id;
   String name;
   String haschild;
  Folders({this.id, this.name,this.haschild});

  factory Folders.fromJson(Map<String, dynamic> json)=> Folders(id: json["id"].toString(),name: json["name"],haschild: json["haschild"].toString());
}
class Files{
  String id ;
  String name ;
  String url ;
  Files({this.id,this.name,this.url});
  factory Files.fromJson(Map<String, dynamic> json)=> Files(id: json["id"].toString(),name: json["name"],url: json["url"]);

}

Answer 1

创建一个抽象类实体，并使文件和文件夹从它扩展。实体可以包含所有文件和文件夹共同的属性，如id和name。

abstract class Entity {
  String id;
  String name;
  
  Entity({String this.id, String this.name});
}

class Folder extends Entity {
    String haschild;
    Folder({ String id, String name, this.haschild }) : super(id: id, name: name);

    factory Folder.fromJson(Map<String, dynamic> json) => Folder(haschild: json["haschild"].toString(), id: json['id'].toString(), name: json['name'].toString());
}

class File extends Entity {
    String url;
    File({ String id, String name, this.url }) : super(id: id, name: name);
  
    factory File.fromJson(Map<String, dynamic> json)=> File(id: json["id"].toString(), name: json["name"].toString(), url: json["url"].toString());
}

创建一个列表而不是单独的列表。它可以同时包含文件模型和文件夹模型，因为它们是从实体扩展而来的，现在只有一个列表包含这两种类型。

var data = jsonDecode(yourJson);

List<Entity> all = <Entity>[];
  
List folders = data["folders"].toList();
List files = data["files"].toList();
  
List<Folder> folders_model = folders.map((e) => Folder.fromJson(e)).toList();
List<File> files_model = files.map((e) => File.fromJson(e)).toList();

all.addAll(folders_model);
all.addAll(files_model);

像这样构建你的小部件

itemCount: all.length,
itemBuilder: (BuildContext context, int currentIndex) {
    Entity e = all[currentIndex];
    if(e is File) {
        File f = e;
        // Create and return your widget for file // You can access all the props of your file model
    } else if(e is Folder) {
        Folder f = e;
        // Create and return your widget for folder // You can access all the props of your folder model
    }
}

编辑=======

以下是dartpad中的最小代码：代码

Answer 2

var json = jsonDecode(your example);
json['files'].forEach((e){
   debugPrint(e['name']);
});

文件夹是相同的