如何從json中獲取數據到flutter中的字符串

Question

我從網址獲取json響應，我想在屏幕設計中顯示數據（即，將數據附加到相關字段中），但是由於數據為null，因此出現錯誤

我在這里添加我的控制器

     feacthstoredetailsdata() async {
    Future<SharedPreferences> _prefs = SharedPreferences.getInstance();

    final SharedPreferences prefs = await _prefs;

    print("PRINT ====> " + prefs.getString("BearerToken"));

    var receivedToken = "Bearer " + prefs.getString("BearerToken");
//    var id=1;

    var receivedstoreid=prefs.getString("store_id");

    print("=========================="+receivedstoreid);

    print("PRINT ::: receivedToken ====> " + receivedToken);
    var res = await http.get("http://your domain.com/api/rest/stores/${receivedstoreid}",
      headers: {
        'Authorization': receivedToken
      },
    );
    var decodedjson = jsonDecode(res.body);

    storeDetails = StoreDetails.fromJson(decodedjson);
    var res1 = storeDetails.toJson();
    print(res1);
//    return storeDetails;

    setState(() {});
  }

我嘗試將數據追加到屏幕上，如下所示

 child: Container(
                  height: 250.0,
                  width: 250.0,
                  margin: EdgeInsets.all(5.0),
                  decoration: BoxDecoration(
                      image: DecorationImage(
                          image: NetworkImage(storeDetails.data.thumb))),
                ),
              ),
            ),

這里storeDetails是我的模型類名稱

 {success: true, data: {store_id: 1, store_image: catalog/stores/asian_spice_market/asian_spice_market_logo.png, thumb: http://bagbash.com/image/cache/catalog/stores/asian_spice_market/asian_spice_market_logo-500x500.png, store_language: en-gb, store_comment: Shop for ¥6000 and get Free delivery., store_open: 10AM-10PM, store_fax: , store_telephone: 0804053636, store_email: kumar4675@i.softbank.jp, store_geocode: , store_address: Yokohama Shi, Naka ku, Noge cho 3-160-4, store_owner: Asian Spice Market, store_name: Asian Spice Market, store_url: http://asianspicemarket.bagbash.com/, longitude: , latitude: }}

這是我得到的回應

Answer 1

您發布的json字符串不能直接使用。 這是我修改的內容。

{"success": true, 
"data": {
"store_id": 1, 
"store_image": "catalog/stores/asian_spice_market/asian_spice_market_logo.png", 
"thumb": "http://bagbash.com/image/cache/catalog/stores/asian_spice_market/asian_spice_market_logo-500x500.png", 
"store_language": "en-gb", 
"store_comment": "Shop for ¥6000 and get Free delivery.", 
"store_open": "10AM-10PM", 
"store_fax": "", 
"store_telephone": "0804053636", 
"store_email": "kumar4675@i.softbank.jp", 
"store_geocode": "", 
"store_address": "Yokohama Shi, Naka ku, Noge cho 3-160-4", 
"store_owner": "Asian Spice Market, store_name: Asian Spice Market", 
"store_url": "http://asianspicemarket.bagbash.com/", 
"longitude": "", 
"latitude":"" 
}

}

你可以用這個解析

// To parse this JSON data, do
//
//     final storeDetails = storeDetailsFromJson(jsonString);

import 'dart:convert';

StoreDetails storeDetailsFromJson(String str) => StoreDetails.fromJson(json.decode(str));

String storeDetailsToJson(StoreDetails data) => json.encode(data.toJson());

class StoreDetails {
    bool success;
    Data data;

    StoreDetails({
        this.success,
        this.data,
    });

    factory StoreDetails.fromJson(Map<String, dynamic> json) => new StoreDetails(
        success: json["success"],
        data: Data.fromJson(json["data"]),
    );

    Map<String, dynamic> toJson() => {
        "success": success,
        "data": data.toJson(),
    };
}

class Data {
    int storeId;
    String storeImage;
    String thumb;
    String storeLanguage;
    String storeComment;
    String storeOpen;
    String storeFax;
    String storeTelephone;
    String storeEmail;
    String storeGeocode;
    String storeAddress;
    String storeOwner;
    String storeUrl;
    String longitude;
    String latitude;

    Data({
        this.storeId,
        this.storeImage,
        this.thumb,
        this.storeLanguage,
        this.storeComment,
        this.storeOpen,
        this.storeFax,
        this.storeTelephone,
        this.storeEmail,
        this.storeGeocode,
        this.storeAddress,
        this.storeOwner,
        this.storeUrl,
        this.longitude,
        this.latitude,
    });

    factory Data.fromJson(Map<String, dynamic> json) => new Data(
        storeId: json["store_id"],
        storeImage: json["store_image"],
        thumb: json["thumb"],
        storeLanguage: json["store_language"],
        storeComment: json["store_comment"],
        storeOpen: json["store_open"],
        storeFax: json["store_fax"],
        storeTelephone: json["store_telephone"],
        storeEmail: json["store_email"],
        storeGeocode: json["store_geocode"],
        storeAddress: json["store_address"],
        storeOwner: json["store_owner"],
        storeUrl: json["store_url"],
        longitude: json["longitude"],
        latitude: json["latitude"],
    );

    Map<String, dynamic> toJson() => {
        "store_id": storeId,
        "store_image": storeImage,
        "thumb": thumb,
        "store_language": storeLanguage,
        "store_comment": storeComment,
        "store_open": storeOpen,
        "store_fax": storeFax,
        "store_telephone": storeTelephone,
        "store_email": storeEmail,
        "store_geocode": storeGeocode,
        "store_address": storeAddress,
        "store_owner": storeOwner,
        "store_url": storeUrl,
        "longitude": longitude,
        "latitude": latitude,
    };
}

Answer 2

根據您的問題，我可以斷定可能導致錯誤的兩件事之一

1）您的api返回null。

2）您的json解碼系統在某處損壞。

要解決第一個錯誤，您必須檢查api中的代碼。 要解決第二個錯誤，您可以使用json之類的工具進行飛鏢生成模型分類，或進入並手動編輯模型，盡管這很繁瑣但最靈活。

飛鏢中的獎勵是Null-aware運算符-> ??。 您可以在沒有null的地方放置默認占位符，而不是讓ui顯示null錯誤。

Answer 3

嘗試從以下位置更改此行代碼

image: NetworkImage(storeDetails.data.thumb))),

至

image: NetworkImage(decodedjson['data']['thumb']))),

如果上述建議無法按預期工作，則可能必須考慮@chunhunghan指出的內容並重新格式化JSON數據。 我不得不[[manually]]重新格式化JSON以結束此操作：

{
    "success": "true",
    "data": {
        "store_id": "1",
        "store_image": "catalog/stores/asian_spice_market/asian_spice_market_logo.png",
        "thumb": "http://bagbash.com/image/cache/catalog/stores/asian_spice_market/asian_spice_market_logo-500x500.png",
        "store_language": "en-gb",
        "store_comment": "Shop for ¥6000 and get Free delivery.",
        "store_open": "10AM-10PM",
        "store_fax": "",
        "store_telephone": "0804053636",
        "store_email": "kumar4675@i.softbank.jp",
        "store_geocode": "",
        "store_address": "Yokohama Shi, Naka ku, Noge cho 3-160-4",
        "store_owner": "Asian Spice Market",
        "store_name": "Asian Spice Market",
        "store_url": "http://asianspicemarket.bagbash.com/",
        "longitude": "",
        "latitude": ""
    }
}

使用Awesome JSON的JSON視圖