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": "2c9f6c94621970a801626a3770620177",
            "mallCategoryId": "4",
            "mallSubName": "北京二鍋頭",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cc035c15a8",
            "mallCategoryId": "4",
            "mallSubName": "大明",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cc2af915a9",
            "mallCategoryId": "4",
            "mallSubName": "杜康",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cc535115aa",
            "mallCategoryId": "4",
            "mallSubName": "頓丘",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cc77b215ab",
            "mallCategoryId": "4",
            "mallSubName": "汾酒",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cca72e15ac",
            "mallCategoryId": "4",
            "mallSubName": "楓林",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cccae215ad",
            "mallCategoryId": "4",
            "mallSubName": "高粱酒",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7ccf0d915ae",
            "mallCategoryId": "4",
            "mallSubName": "古井",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cd1d6715af",
            "mallCategoryId": "4",
            "mallSubName": "貴州大麴",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cd3f2815b0",
            "mallCategoryId": "4",
            "mallSubName": "國池",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cd5d3015b1",
            "mallCategoryId": "4",
            "mallSubName": "國窖",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cd7ced15b2",
            "mallCategoryId": "4",
            "mallSubName": "國臺",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cd9b9015b3",
            "mallCategoryId": "4",
            "mallSubName": "漢醬",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cdbfd215b4",
            "mallCategoryId": "4",
            "mallSubName": "紅星",
            "comments": null
        }, {
            "mallSubId": "2c9f6c946891d16801689474e2a70081",
            "mallCategoryId": "4",
            "mallSubName": "懷莊",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cdddf815b5",
            "mallCategoryId": "4",
            "mallSubName": "劍南春",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cdfd4815b6",
            "mallCategoryId": "4",
            "mallSubName": "江小白",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb1016802277c37160e",
            "mallCategoryId": "4",
            "mallSubName": "金沙",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7ce207015b7",
            "mallCategoryId": "4",
            "mallSubName": "京宮",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7ce46d415b8",
            "mallCategoryId": "4",
            "mallSubName": "酒鬼",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb101680226de23160d",
            "mallCategoryId": "4",
            "mallSubName": "口子窖",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7ce705515b9",
            "mallCategoryId": "4",
            "mallSubName": "郎酒",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7ce989e15ba",
            "mallCategoryId": "4",
            "mallSubName": "老口子",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cec30915bb",
            "mallCategoryId": "4",
            "mallSubName": "龍江家園",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cef15c15bc",
            "mallCategoryId": "4",
            "mallSubName": "瀘州",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cf156f15bd",
            "mallCategoryId": "4",
            "mallSubName": "鹿邑大麴",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cf425b15be",
            "mallCategoryId": "4",
            "mallSubName": "毛鋪",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cf9dc915c0",
            "mallCategoryId": "4",
            "mallSubName": "綿竹",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cfbf1c15c1",
            "mallCategoryId": "4",
            "mallSubName": "可貴糊塗",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cfdd7215c2",
            "mallCategoryId": "4",
            "mallSubName": "牛二爺",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7cf71e715bf",
            "mallCategoryId": "4",
            "mallSubName": "茅臺",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7d7eda715c3",
            "mallCategoryId": "4",
            "mallSubName": "綿竹",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7d96e5c15c4",
            "mallCategoryId": "4",
            "mallSubName": "可貴糊塗",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dab93b15c5",
            "mallCategoryId": "4",
            "mallSubName": "牛二爺",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dae16415c6",
            "mallCategoryId": "4",
            "mallSubName": "牛欄山",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7db11cb15c7",
            "mallCategoryId": "4",
            "mallSubName": "前門",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7db430c15c8",
            "mallCategoryId": "4",
            "mallSubName": "全興",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7db6cac15c9",
            "mallCategoryId": "4",
            "mallSubName": "捨得",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7db9a4415ca",
            "mallCategoryId": "4",
            "mallSubName": "雙溝",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dc30b815cb",
            "mallCategoryId": "4",
            "mallSubName": "水井坊",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dc543e15cc",
            "mallCategoryId": "4",
            "mallSubName": "四特",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dc765c15cd",
            "mallCategoryId": "4",
            "mallSubName": "潭酒",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dc988a15ce",
            "mallCategoryId": "4",
            "mallSubName": "沱牌",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dcba5a15cf",
            "mallCategoryId": "4",
            "mallSubName": "五糧液",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dcd9e815d0",
            "mallCategoryId": "4",
            "mallSubName": "西鳳",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dcf6d715d1",
            "mallCategoryId": "4",
            "mallSubName": "習酒",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dd11b215d2",
            "mallCategoryId": "4",
            "mallSubName": "小白楊",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dd2f3c15d3",
            "mallCategoryId": "4",
            "mallSubName": "洋河",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7dd969115d4",
            "mallCategoryId": "4",
            "mallSubName": "伊力特",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7ddb16c15d5",
            "mallCategoryId": "4",
            "mallSubName": "張弓",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7ddd6c715d6",
            "mallCategoryId": "4",
            "mallSubName": "中糧",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7de126815d7",
            "mallCategoryId": "4",
            "mallSubName": "竹葉青",
            "comments": null
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170036_4477.png"
    }, {
        "mallCategoryId": "1",
        "mallCategoryName": "啤酒",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c946016ea9b016016f79c8e0000",
            "mallCategoryId": "1",
            "mallSubName": "百威",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94608ff843016095163b8c0177",
            "mallCategoryId": "1",
            "mallSubName": "福佳",
            "comments": ""
        }, {
            "mallSubId": "402880e86016d1b5016016db9b290001",
            "mallCategoryId": "1",
            "mallSubName": "哈爾濱",
            "comments": ""
        }, {
            "mallSubId": "402880e86016d1b5016016dbff2f0002",
            "mallCategoryId": "1",
            "mallSubName": "漢德",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647cd6830e0022",
            "mallCategoryId": "1",
            "mallSubName": "嶗山",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647cd706a60023",
            "mallCategoryId": "1",
            "mallSubName": "林德曼",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e1411b15d8",
            "mallCategoryId": "1",
            "mallSubName": "青島",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e1647215d9",
            "mallCategoryId": "1",
            "mallSubName": "三得利",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e182e715da",
            "mallCategoryId": "1",
            "mallSubName": "烏蘇",
            "comments": null
        }, {
            "mallSubId": "2c9f6c9468118c9c016811ab16bf0001",
            "mallCategoryId": "1",
            "mallSubName": "雪花",
            "comments": null
        }, {
            "mallSubId": "2c9f6c9468118c9c016811aa6f440000",
            "mallCategoryId": "1",
            "mallSubName": "燕京",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e19b8f15db",
            "mallCategoryId": "1",
            "mallSubName": "智美",
            "comments": null
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170044_9165.png"
    }, {
        "mallCategoryId": "2",
        "mallCategoryName": "葡萄酒",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c9460337d540160337fefd60000",
            "mallCategoryId": "2",
            "mallSubName": "澳大利亞",
            "comments": ""
        }, {
            "mallSubId": "402880e86016d1b5016016e083f10010",
            "mallCategoryId": "2",
            "mallSubName": "德國",
            "comments": ""
        }, {
            "mallSubId": "402880e86016d1b5016016df1f92000c",
            "mallCategoryId": "2",
            "mallSubName": "法國",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94621970a801626a40feac0178",
            "mallCategoryId": "2",
            "mallSubName": "南非",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e5c9a115dc",
            "mallCategoryId": "2",
            "mallSubName": "葡萄牙",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e5e68f15dd",
            "mallCategoryId": "2",
            "mallSubName": "西班牙",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e609f515de",
            "mallCategoryId": "2",
            "mallSubName": "新西蘭",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e6286a15df",
            "mallCategoryId": "2",
            "mallSubName": "意大利",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e6486615e0",
            "mallCategoryId": "2",
            "mallSubName": "智利",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7e66c6815e1",
            "mallCategoryId": "2",
            "mallSubName": "中國",
            "comments": null
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170053_878.png"
    }, {
        "mallCategoryId": "3",
        "mallCategoryName": "清酒洋酒",
        "bxMallSubDto": [{
            "mallSubId": "402880e86016d1b5016016e135440011",
            "mallCategoryId": "3",
            "mallSubName": "清酒",
            "comments": ""
        }, {
            "mallSubId": "402880e86016d1b5016016e171cc0012",
            "mallCategoryId": "3",
            "mallSubName": "洋酒",
            "comments": ""
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170101_6957.png"
    }, {
        "mallCategoryId": "5",
        "mallCategoryName": "保健酒",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c94609a62be0160a02d1dc20021",
            "mallCategoryId": "5",
            "mallSubName": "黃酒",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94648837980164883ff6980000",
            "mallCategoryId": "5",
            "mallSubName": "藥酒",
            "comments": ""
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170110_6581.png"
    }, {
        "mallCategoryId": "2c9f6c946449ea7e01647ccd76a6001b",
        "mallCategoryName": "預調酒",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c946449ea7e01647d02f6250026",
            "mallCategoryId": "2c9f6c946449ea7e01647ccd76a6001b",
            "mallSubName": "果酒",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647d031bae0027",
            "mallCategoryId": "2c9f6c946449ea7e01647ccd76a6001b",
            "mallSubName": "雞尾酒",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647d03428f0028",
            "mallCategoryId": "2c9f6c946449ea7e01647ccd76a6001b",
            "mallSubName": "米酒",
            "comments": ""
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170124_4760.png"
    }, {
        "mallCategoryId": "2c9f6c946449ea7e01647ccf3b97001d",
        "mallCategoryName": "下酒小菜",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c946449ea7e01647dc18e610035",
            "mallCategoryId": "2c9f6c946449ea7e01647ccf3b97001d",
            "mallSubName": "熟食",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dc1d9070036",
            "mallCategoryId": "2c9f6c946449ea7e01647ccf3b97001d",
            "mallSubName": "火腿",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dc1fc3e0037",
            "mallCategoryId": "2c9f6c946449ea7e01647ccf3b97001d",
            "mallSubName": "速凍食品",
            "comments": ""
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170133_4419.png"
    }, {
        "mallCategoryId": "2c9f6c946449ea7e01647ccdb0e0001c",
        "mallCategoryName": "飲料",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c946449ea7e01647d09cbf6002d",
            "mallCategoryId": "2c9f6c946449ea7e01647ccdb0e0001c",
            "mallSubName": "茶飲",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647d09f7e8002e",
            "mallCategoryId": "2c9f6c946449ea7e01647ccdb0e0001c",
            "mallSubName": "水飲",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647d0a27e1002f",
            "mallCategoryId": "2c9f6c946449ea7e01647ccdb0e0001c",
            "mallSubName": "功能飲料",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647d0b1d4d0030",
            "mallCategoryId": "2c9f6c946449ea7e01647ccdb0e0001c",
            "mallSubName": "果汁",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647d14192b0031",
            "mallCategoryId": "2c9f6c946449ea7e01647ccdb0e0001c",
            "mallSubName": "含乳飲料",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647d24d9600032",
            "mallCategoryId": "2c9f6c946449ea7e01647ccdb0e0001c",
            "mallSubName": "碳酸飲料",
            "comments": ""
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170143_361.png"
    }, {
        "mallCategoryId": "2c9f6c946449ea7e01647cd108b60020",
        "mallCategoryName": "乳製品",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c946449ea7e01647dd4ac8c0048",
            "mallCategoryId": "2c9f6c946449ea7e01647cd108b60020",
            "mallSubName": "常溫純奶",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dd4f6a40049",
            "mallCategoryId": "2c9f6c946449ea7e01647cd108b60020",
            "mallSubName": "常溫酸奶",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dd51ab7004a",
            "mallCategoryId": "2c9f6c946449ea7e01647cd108b60020",
            "mallSubName": "低溫奶",
            "comments": ""
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170151_9234.png"
    }, {
        "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
        "mallCategoryName": "休閒零食",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c946449ea7e01647dc51d93003c",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "方便食品",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dd204dc0040",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "麪包糕點",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dd22f760041",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "糖果巧克力",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dd254530042",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "膨化食品",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7fa132b15e7",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "堅果炒貨",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7f4bfc415e2",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "肉乾豆乾",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7f5027a15e3",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "餅乾",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94679b4fb10167f7f530fd15e4",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "衝調",
            "comments": null
        }, {
            "mallSubId": "2c9f6c94683a6b0d016846b49436003b",
            "mallCategoryId": "2c9f6c946449ea7e01647ccfddb3001e",
            "mallSubName": "休閒水果",
            "comments": null
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190131/20190131170200_7553.png"
    }, {
        "mallCategoryId": "2c9f6c946449ea7e01647cd08369001f",
        "mallCategoryName": "糧油調味",
        "bxMallSubDto": [{
            "mallSubId": "2c9f6c946449ea7e01647dd2e8270043",
            "mallCategoryId": "2c9f6c946449ea7e01647cd08369001f",
            "mallSubName": "油/糧食",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dd31bca0044",
            "mallCategoryId": "2c9f6c946449ea7e01647cd08369001f",
            "mallSubName": "調味品",
            "comments": ""
        }, {
            "mallSubId": "2c9f6c946449ea7e01647dd35a980045",
            "mallCategoryId": "2c9f6c946449ea7e01647cd08369001f",
            "mallSubName": "醬菜罐頭",
            "comments": ""
        }],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20181212/20181212115842_9733.png"
    }, {
        "mallCategoryId": "2c9f6c9468a85aef016925444ddb271b",
        "mallCategoryName": "積分商品",
        "bxMallSubDto": [],
        "comments": null,
        "image": "http://images.baixingliangfan.cn/firstCategoryPicture/20190225/20190225232703_9950.png"
    }]
}

模型層的創建

把模型層單獨放到一個文件夾裏，而後創建一個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()
    );
  }
  
}

這樣就創建好了一個模型，其實這個模型還能夠繼續創建，之後的課程中也會逐漸深刻。這裏到這裏，相信你們都掌握了創建模型的方法。

數據模型的使用

使用數據模型就簡單不少了。直接聲明變量，調用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，都是先操做一下，而後再改的。算是一個小竅門吧。

地址：https://javiercbk.github.io/json_to_dart/

實例：分類列表

自動生成model模型 

更名爲CategoryModel

左側動態菜單的創建

快速創建了一個名字爲LeftCategoryNav的StatefulWidget。並聲明瞭一個List數據，起名就叫list。具體代碼以下：

//左側大類導航
class LeftCategoryNav extends StatefulWidget {
  _LeftCategoryNavState createState() => _LeftCategoryNavState();
}

class _LeftCategoryNavState extends State<LeftCategoryNav> {
   List list=[];
   
  @override
  Widget build(BuildContext context) {
    return Container();
  }

}

把上面的調用後臺類別的方法拷貝到這裏，並進行改寫。注意這裏咱們使用了setState來改變lsit 的狀態，這樣咱們從後臺獲取數據後，頁面就會有數據。

void _getCategory()async{
    await request('post','getCategory').then((val){
      var data = json.decode(val.toString());
      //print(data);
      CategoryModel category = CategoryModel.fromJson(data);
      setState(() {
        list = category.data; 
      });
      //list.data.forEach((item)=>print(item.mallCategoryName));
    });
 }

編寫大類子項

把大類裏的子項分紅一個單獨的方法，這樣能夠起到複用的做用。主要知識點是用模型的形式展現數據。

Widget _leftInkWell(int index){
    return InkWell(
      onTap: (){},
      child: Container(
        height: ScreenUtil().setHeight(100),
        padding: EdgeInsets.only(left: 10,top: 13),
        decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
            bottom: BorderSide(width: 1,color: Colors.black12)
          )
        ),
        child: Text(list[index].mallCategoryName,style: TextStyle(fontSize: ScreenUtil().setSp(28))),
      ),
    );
  }

完善build方法

當子類別寫好後，能夠對build方法進行完善，build方法咱們採用動態的ListView來寫，代碼以下：

@override
  Widget build(BuildContext context) {
    
    return Container(
      width: ScreenUtil().setWidth(180),
      decoration: BoxDecoration(
        border: Border(
          right: BorderSide(width: 1,color: Colors.black12)
        )
      ),
      child: ListView.builder(
        itemCount: list.length,
        itemBuilder:(context,index){
          return _leftInkWell(index);
        }
      ),   
    );
  }

咱們但願獲取數據只在Widget初始化的時候進行，因此再重寫一個initState方法。

@override
  void initState() { 
    _getCategory(); //請求接口的數據
    super.initState();
  }

寫完這步，就能夠進行預覽了，在分類頁面也該已經展現出了大類的一個類別列表。

完整代碼：

import 'package:flutter/material.dart';
import '../service/service_method.dart';
import 'dart:convert';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import '../model/category.dart';

class CategoryPage extends StatefulWidget {
  _CategoryPageState createState() => _CategoryPageState();
}

class _CategoryPageState extends State<CategoryPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('商品分類')),
      body: Container(
        child: Row(
          children: <Widget>[
            LeftCategoryNav(),

          ]
        ) 
      )   
    );
  }

}

//左側大類導航
class LeftCategoryNav extends StatefulWidget {
  _LeftCategoryNavState createState() => _LeftCategoryNavState();
}

class _LeftCategoryNavState extends State<LeftCategoryNav> {
  List list = [];

  @override
  void initState() { 
    _getCategory(); //請求接口的數據
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    
    return Container(
      width: ScreenUtil().setWidth(180),
      decoration: BoxDecoration(
        border: Border(
          right: BorderSide(width: 1,color: Colors.black12)
        )
      ),
      child: ListView.builder(
        itemCount: list.length,
        itemBuilder:(context,index){
          return _leftInkWell(index);
        }
      ),   
    );
  }

  Widget _leftInkWell(int index){
    return InkWell(
      onTap: (){},
      child: Container(
        height: ScreenUtil().setHeight(100),
        padding: EdgeInsets.only(left: 10,top: 13),
        decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
            bottom: BorderSide(width: 1,color: Colors.black12)
          )
        ),
        child: Text(list[index].mallCategoryName,style: TextStyle(fontSize: ScreenUtil().setSp(28))),
      ),
    );
  }

  void _getCategory()async{
    await request('post','getCategory').then((val){
      var data = json.decode(val.toString());
      //print(data);
      CategoryModel category = CategoryModel.fromJson(data);
      setState(() {
        list = category.data; 
      });
      //list.data.forEach((item)=>print(item.mallCategoryName));
    });
  }

}