1. 程式人生 > 實用技巧 >Flutter JSON解析與複雜模型轉換技巧

Flutter JSON解析與複雜模型轉換技巧

其實轉換成model類是有好處的,轉換後可以減少上線後APP崩潰和出現異常,所以我們從這節課開始,要製作model類模型,然後用model的形式編輯UI介面。

類別json的分析

比如現在從後臺得到了一串jsON資料:

{
    "code": "0",
    "message": "success",
    "data": [{
        "mallCategoryId": "4",
        "mallCategoryName": "白酒",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c94621970a801626a35cb4d0175",
            "mallCategoryId": "4",
            "mallSubName": "名酒",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94621970a801626a363e5a0176",
            "mallCategoryId": "4",
            "mallSubName": "寶丰",
            "comments": ""
        },{
            "mallSubId": "2c9f6c94679b4fb10167f7de126815d7",
            "mallCategoryId": "4",
            "mallSubName": "竹葉青",
            "comments": null
        }],
        "comments": null,
}

模型層的建立

把模型層單獨放到一個資料夾裡,然後建立一個category.dart檔案。這個檔案就是要結合json檔案,形成的modle檔案。檔案裡大量使用了dart中的 factory語法。

工廠建構函式

factory 關鍵字的功能,當實現建構函式但是不想每次都建立該類的一個例項的時候使用。

工廠模式是我們最常用的例項化物件模式了,是用工廠方法代替new操作的一種模式。用簡單明瞭的方式解釋,模式上類似於面向物件的多型,用起來和靜態方法差不多。高雅和低俗的結合,相當於聽著貝多芬的交響樂《命運》,看著波多野結衣的島國小電影,只要你爽,什麼都可以。

我們先製作了一個大分類的Class,程式碼如下:

class CategoryBigModel{
  String mallCategoryId; //類別ID
  String mallCategoryName; //型別名稱
  List<dynamic> bxMallSubDto; //子類  dynamic動態的
  Null comments; //描述
  String image; //圖片
  //建構函式
  CategoryBigModel({
    this.mallCategoryId, this.mallCategoryName, this.bxMallSubDto, this.comments, this.image
  });

  //工廠模式-用這種模式可以省略New關鍵字
  factory CategoryBigModel.fromJson(dynamic json){
    return CategoryBigModel(
      mallCategoryId: json[‘mallCategoryId‘],
      mallCategoryName:json[‘mallCategoryName‘],
      bxMallSubDto:json[‘bxMallSubDto‘],
      comments:json[‘comments‘],
      image:json[‘image‘],
    );
  }

}

這個只是單個的一個大類資訊的模型,但我們是一個列表,這時候就需要製作一個列表的模型,而這個List裡邊是我們定義的CategoryBigModel模型。簡單理解就是先定義一個單項模型,然後再定義個列表的模型。

class CategoryBigListModel {

  List<CategoryBigModel> data;
  CategoryBigListModel(this.data);
  factory CategoryBigListModel.formJson(List json){
    return CategoryBigListModel(
      json.map((i)=>CategoryBigModel.fromJson((i))).toList()
    );
  }
  
}

這樣就建立好了一個模型,其實這個模型還可以繼續建立,以後的課程中也會逐漸深入。這裡到這裡,相信大家都掌握了建立模型的方法。

廣州品牌設計公司https://www.houdianzi.com

資料模型的使用

使用資料模型就簡單很多了。直接宣告變數,呼叫formJson方法就可以了。直接在_getCategory()方法裡。記得先引入資料模型類,然後用.的形式進行輸出了。

import ‘../model/category.dart‘;
void _getCategory() async{
    await request(‘post‘, ‘getCategory‘).then((val){
      var data = json.decode(val.toString());
      //print(data);
      CategoryBigListModel list = CategoryBigListModel.formJson(data[‘data‘]);
      list.data.forEach((item) => print(item.mallCategoryName));
    });
}

寫完這些,你就可以在控制檯看到結果了。如果是第一次接觸資料模型,可能還是稍微有些繞的。

json_to_dart的使用

如果我們得到一個特別複雜的JSON,有時候會無從下手開始寫Model,這時候就可以使用一些輔助工具。我認為json_to_dart是比較好用的一個。它可以直接把json轉換成dart類,然後進行一定的修改,就可以快樂的使用了。工作中我拿到一個json,都是先操作一下,然後再改的。算是一個小竅門吧。