FlutterJson數組轉換為List對象及Dio請求結果換為List對象

1.實體類

class VideoInfo {
  String body;
  int id;
  String title;
  int userId;

  VideoInfo({this.body, this.id, this.title, this.userId});

  factory VideoInfo.fromJson(Map<String, dynamic> json) {
    return VideoInfo(
      body: json['body'],
      id: json['id'],
      title: json['title'],
      userId: json['userId'],
    );
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['body'] = this.body;
    data['id'] = this.id;
    data['title'] = this.title;
    data['userId'] = this.userId;
    return data;
  }
}      

1.1.Json數組轉List對象

假設我們的Json數組是這樣的：

[
  {
    "userId": 1,
    "id": 1,
    "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
    "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
  },
  {
    "userId": 1,
    "id": 2,
    "title": "qui est esse",
    "body": "est rerum tempore vitae\nsequi sint nihil reprehenderit dolor beatae ea dolores neque\nfugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis\nqui aperiam non debitis possimus qui neque nisi nulla"
  }
 ]      

将json數組轉為List對象的方法如下：

=
            '[{"userId": 1,"id": 1,"title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit","body": "quia et suscipit suscipit recusandae consequuntur expedita et cum reprehenderit molestiae ut ut quas totam nostrum rerum est autem sunt rem eveniet architecto"},{"userId": 1,"id": 2,"title": "qui est esse","body": "est rerum tempore vitae sequi sint nihil reprehenderit dolor beatae ea dolores neque fugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis qui aperiam non debitis possimus qui neque nisi nulla"}]';

///  或json.decode(s);  實際的類型是List<dynamic>
var listDynamic = jsonDecode(jsonStr);
/// 顯式類型轉換, List<dynamic>   ->  List<Map<String, dynamic>>
List<Map<String, dynamic>> listMap =
            new List<Map<String, dynamic>>.from(listDynamic);
List<VideoInfo> M = new List();
listMap.forEach((m) => M.add(VideoInfo.fromJson(m)));
print("資料為${M[0].title}");      

或者用以下方法，更為簡潔高效：

String jsonStr =
            '[{"userId": 1,"id": 1,"title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit","body": "quia et suscipit suscipit recusandae consequuntur expedita et cum reprehenderit molestiae ut ut quas totam nostrum rerum est autem sunt rem eveniet architecto"},{"userId": 1,"id": 2,"title": "qui est esse","body": "est rerum tempore vitae sequi sint nihil reprehenderit dolor beatae ea dolores neque fugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis qui aperiam non debitis possimus qui neque nisi nulla"}]';
///  或json.decode(s);  實際的類型是List<dynamic>
var listDynamic = jsonDecode(jsonStr);
List<VideoInfo> MM = (listDynamic as List<dynamic>).map((e) => VideoInfo.fromJson((e as Map<String,dynamic>))).toList();
print("資料為${MM[0].title}");      

1.2.Dio請求結果轉List對象

loadData() async {
    String dataURL = "https://jsonplaceholder.typicode.com/posts";
    try {
      Response response = await Dio().get(
        dataURL,
        options: Options(responseType: ResponseType.json),
      );
      if (response.statusCode == 200) {
        print("響應資料:${response.data}");
        /// 更新UI
        setState(() {
          /// 解析資料
          List<VideoInfo> list = (response.data as List<dynamic>)
              .map((e) => VideoInfo.fromJson((e as Map<String, dynamic>)))
              .toList();
          print("My Data:${list[0].title}");
        });
      } else {
        print("失敗${response.statusCode}");
      }
    } catch (e) {
      print(e);
    }
  }      

在上面的請求中，Dio傳回的結果為List<dynamic>，我想要的結果是List<VideoInfo>，那麼我們的思路就是：

1.因為拿回來的資料Response沒有指定泛型，是以預設為dynamic,是以我們要将其類型轉換回List<dynamic>，即：

response.data as List<dynamic>      

如果我們指定了Response的泛型為List<dynamic>，則不需要做這一步的工作，即Response<List<dynamic>>：

Response<List<dynamic>> response = await Dio().get(
        dataURL,
        options: Options(responseType: ResponseType.json),
      );      

1.首先将List<dynamic>中的泛型dynamic轉換成Map<String,dynamic>，也就是将List<dynamic>轉成List<Map<String,dynamic>>，即e as Map<String, dynamic>,再利用我們的對象VideoInfo.fromJson()方法，生成我們的對象，即：

VideoInfo.fromJson((e as Map<String, dynamic>))      

完成的轉換過程為：

/// 解析資料
List<VideoInfo> list = (response.data as List<dynamic>)
              .map((e) => VideoInfo.fromJson((e as Map<String, dynamic>)))
              .toList();      

2.總結