Flutter json数组解析

Posted 2023-04-19

【中文标题】Flutter json数组解析

【英文标题】：Flutter json array parsing

【发布时间】：2020-06-26 00:44:51

【问题描述】：

我知道这是一个常见问题，但我没有找到任何解决方案，所以我在这里提出一个问题。

JSON格式如下，

[
  
    "id": "127",
    "image": "https://www.website.com/imgFldr/app/app-bangalore3.jpg",
    "city": "Bangalore",
    "store_mobile": "+91-978XXXXXXX",
    "search_by": "Search one",
    "url": "image url",
    "store_address": "Address 1"
  ,
  
    "id": "128",
    "image": "https://www.website.com/imgFldr/app/app-bangalore2.jpg",
    "city": "Bangalore",
    "store_mobile": "+91-978XXXXXXX",
    "search_by": "Search 2",
    "url": "image url",
    "store_address": "Address 2"
  ,
  
    "id": "137",
    "image": "https://www.website.com/imgFldr/app/app-bangalore.jpg",
    "city": "Bangalore",
    "store_mobile": "+91-978XXXXXXX",
    "search_by": "Search 3",
    "url": "image url",
    "store_address": "Address 3"
  ,
  
    "id": "132",
    "image": "https://www.website.com/imgFldr/app/app-mumbai-2.jpg",
    "city": "Mumbai",
    "store_mobile": "+91-978XXXXXXX",
    "search_by": "Search 4",
    "url": "image url",
    "store_address": "Address 4"
  ,
  
    "id": "139",
    "image": "https://www.website.com/imgFldr/app/app-mumbai.jpg",
    "city": "Mumbai",
    "store_mobile": "+91-978XXXXXXX",
    "search_by": "Search 5",
    "url": "image url",
    "store_address": "Address 5"
  
]

响应以数组的形式出现。 我确实喜欢这个，模型类

class Stores 
String id;
String image;
String city;
String storeMobile;
String searchBy;
String url;
String storeAddress;

Stores(
  this.id,
  this.image,
  this.city,
  this.storeMobile,
  this.searchBy,
  this.url,
  this.storeAddress);

Stores.fromJson(Map<String, dynamic> json) 
id = json['id'];
image = json['image'];
city = json['city'];
storeMobile = json['store_mobile'];
searchBy = json['search_by'];
url = json['url'];
storeAddress = json['store_address'];


Map<String, dynamic> toJson() 
final Map<String, dynamic> data = new Map<String, dynamic>();
data['id'] = this.id;
data['image'] = this.image;
data['city'] = this.city;
data['store_mobile'] = this.storeMobile;
data['search_by'] = this.searchBy;
data['url'] = this.url;
data['store_address'] = this.storeAddress;
return data;
 

在 main.dart 类中

List<Stores> storeList = new List();
Future<Null> getStoresData() async 
setState(() 
  loading = true;
);

final response = await http.get(Uri.encodeFull(APIs.url_getStoreData));
List<dynamic> list = jsonDecode(utf8.decode(response.bodyBytes));

Stores str = Stores.fromJson(list[0]);

storeList.add(str);
print("list Value : $list");
print("Store : $storeList");

setState(() 
  loading = false;
);

JSON 以单个字符串形式出现。我无法在 ListTiles 上使用它，因为

storeList[index]['city'],

当我尝试打印时('Size : $storeList.length');它只打印 =1

请帮忙，谢谢。

【参考方案1】：

使用 ListBuilder

_StoreListAPI() async 
final response = await http.get(
 APINAME,
);
if (response.statusCode == 200) 
  final result = json.decode(response.body);
  List<dynamic> list = result;
  print("response----$result");
  List<Stores> storelist= list.map((i) => Stores.fromJson(i)).toList();
  print("response--22--"+list_[0].toJson().toString());
  setState(() => 
    _storelist = storelist,
    isLoading  = false
  );

 else 
  setState(() => 
    isLoading  = false
  );

  

小部件

 body:FutureBuilder<List<Stores>>(
            future: _storelist
            builder: (BuildContext context, AsyncSnapshot<List<Stores>> snapshot) 
              if (snapshot.data !=null) 
                return ListView.builder(
                  physics: BouncingScrollPhysics(),
                  itemCount: snapshot.data.length,
                  itemBuilder: (BuildContext context, int index) 
    return  ListTile()
    ));

【讨论】：

我不明白你的意思->你破坏数组的对象的名称

现在检查 当你首先有一个数组时它很简单，当 API 显示这样的结果时："data": [] 现在当你收到一个对象数组时它很简单

【参考方案2】：

长度即将增加，因为您只向列表中添加了一项。 你如何将整个列表转换成你的模型

List<Stores> storeList = new List();
Future<Null> getStoresData() async 
setState(() 
loading = true;
);

final response = await http.get(Uri.encodeFull(APIs.url_getStoreData));
List<dynamic> list = jsonDecode(utf8.decode(response.bodyBytes));

for(int i = 0 ; i<list.length;i++)
storeList.add(Stores.fromJson(list[i]));

print("list Value : $list");
print("Store : $storeList");

setState(() 
 loading = false;
);