将未来<列表>传递<int>到按钮中的快照中

Question

我正在使用一个FutureBuilder，它的ListView.builderitemCount为 3，因此它将显示三个OutlineButton，它们携带我通过Future<List<int>>检索的 FirestoreString。该列表基本上有三个随机生成的整数，但满足某些条件。值很好。

return FutureBuilder(
future: getAllWords(args.collectionId),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return CircularProgressIndicator();
}
return ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: 3,
itemBuilder: (context, index) {
//Future that returns a list of 3 integers
getRestRandom(args.collectionId).then(handler); 
int handler(picked){
return picked;
}
return ButtonBar(
children: <Widget>[
OutlineButton(
child: Text(snapshot
.data[picked] // 1st, 2nd, and 3rd value from List
.data["tagalog"]),
onPressed: checkCorrect
? () {
setState(() {
});
}
: () {
print("FALSE");
})
],
);
});
});

该行getRestRandom(args.collectionId).then(handler);返回一个错误，指出"在声明局部变量'处理程序'之前无法引用它。

将清单输入OutlineButton文本的最佳方法是什么？

Answer 1

与其使用then等待getRestRandom()，不如使用嵌套FutureBuilder等待列表生成，然后使用它来填充您的ListView：

return FutureBuilder(
future: getAllWords(args.collectionId),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return CircularProgressIndicator();
}
return FutureBuilder<List<int>>(
future: getRestRandom(args.collectionId),
builder: (context, numbersSnapshot){
if (!numbersSnapshot.hasData) {
return CircularProgressIndicator();
}
return ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: 3,
itemBuilder: (context, index) {
return ButtonBar(
children: <Widget>[
OutlineButton(
child: Text(snapshot
.data[numbersSnapshot.data[index]] // 1st, 2nd, and 3rd value from List
.data["tagalog"]),
onPressed: checkCorrect
? () {
setState(() {
});
}
: () {
print("FALSE");
})
],
);
});
}
);
});