如何创建一个 Flutter Futurebuilder 函数来显示从 JSON 中获取的字符串数组?
Posted
技术标签:
【中文标题】如何创建一个 Flutter Futurebuilder 函数来显示从 JSON 中获取的字符串数组?【英文标题】:How do I create a Flutter Futurebuilder function that displays an array of Strings taken from JSON? 【发布时间】:2019-09-12 16:22:12 【问题描述】:我在 Flutter 中有一个项目管理应用程序,并将这些项目排列在一个列表视图中。我以 JSON 格式从 API 获取数据,并希望显示正在处理该项目的用户!
JSON:
"id": 81,
"users": [
"username": "hugo",
"fullname": "Hugo Johnsson"
,
"username": "studentone",
"fullname": "Student One"
],
"title": "test med teacher chat",
"description": "This project does not have a description.",
"subject": "No subject",
"deadline": "2019-01-06",
"days_left": "107 days ago",
"overview_requests": [
"id": 28,
"user":
"username": "hugo",
"fullname": "Hugo Johnsson"
,
"group": 81
]
Flutter 中的类:
class Project
final int id;
final String title;
final String description;
final String deadline;
final String subject;
final String days_left;
final List<USER> users;
Project(
this.id,
this.title,
this.description,
this.deadline,
this.subject,
this.days_left,
this.users
);
class USER
final String username;
final String fullname;
USER(
this.username,
this.fullname
);
未来(用于 Futurebuilder):
Future<List<Project>> _getProjects() async
var data = await http.get(--ADRESS--);
var jsonData = json.decode(data.body); //an array of json objects
List<Project> allProjects = [];
for (var JData in jsonData)
Project project = Project(
JData["id"],
JData["title"],
JData["description"],
JData["deadline"],
JData["subject"],
JData["days_left"],
JData[USER("username", "fullname")]
allProjects.add(project);
return allProjects;
UI 存在一个返回 listview.builder 的 futurebuilder。未来是上面的功能,我想在另一个列表视图中显示用户名。
So this is what I want it to look like, the difference is that the Text inside the Circle Avatars should be the fist letters of the usernames
如何取出字符串?
Text(snapshot.data[index].users.username
【问题讨论】:
【参考方案1】:小部件
Widget build(BuildContext context)
return FutureBuilder(
future: _getProjects(),
builder: (context, snapshot) => ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (context, index) => ListView.builder(
itemCount: snapshot.data[index].users.length,
itemBuilder: (context, userIndex) => Text(snapshot.data[index].users[userIndex].username[0]),
),
),
);
服务
Future<List<Project>> _getProjects() async
var data = await http.get(--ADRESS--);
var jsonData = json.decode(data.body); //an array of json objects
List<Project> allProjects = [];
for (var JData in jsonData)
List<USER> users = JData["users"] == null
? []
: JData["users"]
.map( (userJson) => USER("username", "fullname") ) // new code
Project project = Project(
JData["id"],
JData["title"],
JData["description"],
JData["deadline"],
JData["subject"],
JData["days_left"],
users,
);
allProjects.add(project);
return allProjects;
【讨论】:
flutter:引发了另一个异常:NoSuchMethodError:在 null 上调用了 getter 'length'。颤振:抛出另一个异常:NoSuchMethodError:方法'[]'在null上被调用。 仍然错误 The getter 'length' was called on null 可能您的用户列表为空。检查您的 _getprojects 功能。在此之后您必须进行调试。 我知道但我不明白怎么做:JData[USER("username", "fullname")] 你有什么想法吗?以上是关于如何创建一个 Flutter Futurebuilder 函数来显示从 JSON 中获取的字符串数组?的主要内容,如果未能解决你的问题,请参考以下文章