[英]How to Map and display nested JSON in Dart/ flutter?
I am new in flutter/ dart and working in a web service powered flutter app. 我是flutter / dart的新手,并且正在使用Web服务驱动的扑动应用程序。 I am currently facing a problem in Mapping and displaying Nested JSON data.
我目前在映射和显示嵌套JSON数据时遇到问题。
The JSON which i need to deal is provided from my local php server JSON format, i have tried and is working with code: 我需要处理的JSON是从我的本地php服务器JSON格式提供的,我已经尝试过并且正在使用代码:
BD: "Bangladesh"
BE: "Belgium"
BF: "Burkina Faso"
BG: "Bulgaria"
code: 码:
Map _countries = new Map();
void _getData() async {
var url = 'http://country.io/names.json';
var response = await http.post(url);
if (response.statusCode == 200) {
setState(() => _countries = json.decode(response.body));
debugPrint('Loaded ${_countries.length} data.');
}
}
Flutter widget to display data: Flutter小部件显示数据:
return Card(
child: new Row(
children: <Widget>[
Expanded(
child: new Text(
'${key} : ',
style: TextStyle(fontSize: 28.0),
),
),
Expanded(
child: new Text(_counties[key],
style: TextStyle(fontSize: 28.0)),
)
],
)
);
I have the server side php code working and is supplying the following json data on POST request 我有服务器端PHP代码工作,并在POST请求上提供以下json数据
JSON data i want to map and display similarly as above: 我希望以与上面类似的方式映射和显示JSON数据:
{
"Employee_id1": {
"first_name": "Staff",
"last_name": "EFGH",
"contact": "1223234555",
"designation": "des1",
"department": "d1",
"picture": "http://i.pravatar.cc/300"
},
"Employee_id2": {
"first_name": "Staff",
"last_name": "EFGH",
"contact": "1223234555",
"designation": "des1",
"department": "d2",
"picture": "http://i.pravatar.cc/300"
},
}
Connection Post request code: 连接发布请求代码:
void _getData() async {
var url = 'http://myIP/file.php';
var response = await http.post(url, body:
{"staffprofiles":"showStaffs"});
if (response.statusCode == 200) {
setState(() => _staffs = json.decode(response.body));
debugPrint('Loaded ${_staffs.length} staff profiles.');
}
}
I want the to show the JSON as profile cards for many staff profiles (in card) i am getting from server in ListView Builder 我希望将JSON显示为我从ListView Builder中的服务器获取的许多员工配置文件(卡中)的配置文件卡
After a few hit and trials i figured out that all i needed was a nested MAP in dart, 经过一些打击和试验,我发现我所需要的只是一个嵌套的飞镖MAP,
Map[key][subkey]
The following code solved my problem: 以下代码解决了我的问题:
return Card(
child: new Row(
children: <Widget>[
Expanded(
child: new Text(
'${key} : ',
style: TextStyle(fontSize: 28.0),
),
),
Expanded(
child: new Text(_employees[key]["first_name"],
style: TextStyle(fontSize: 28.0)),
)
],
)
);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.