在我的Flutter应用程序中,有一个可通过按钮访问的自定义抽屉.在这个抽屉里,有一个小部件(InfoCard),它显示了一些用户的信息.然而,在这个小部件中,有一个FutureBuilder,所以每次显示抽屉时都会显示一个CircularProgressIndicator,直到它从Firerestore服务器获得所有信息.我的问题是:我可以避免FutureBuilder,这样当应用程序完全加载时,它就可以获得小部件所需的所有数据吗?
与此相关的另一个问题是,我需要等待Firestore数据库加载后才返回InfoCard小部件(我不知道为什么,因为当应用程序启动时所有的数据都已经加载了).所以问题是:我必须避免调用数据库,或者在构建小部件之前以某种方式调用它,这样我就不需要使用FutureBuilder了.
下面是小工具抽屉:
class SideDrawer extends ConsumerStatefulWidget {
SideDrawer({
super.key,
required this.setIndex,
});
Function(int index) setIndex;
@override
ConsumerState<SideDrawer> createState() => _SideDrawerState();
}
class _SideDrawerState extends ConsumerState<SideDrawer> {
@override
Widget build(BuildContext context) {
final userP = ref.watch(userStateNotifier);
return Scaffold(
body: Container(
width: MediaQuery.sizeOf(context).width * 3 / 4,
height: double.infinity,
color: Theme.of(context).colorScheme.secondary,
child: SafeArea(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
FutureBuilder<Widget>(
future: Datas().infocard(userP),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.hasError) {
return Text('Errore: ${snapshot.error}');
}
return snapshot.data!;
} else {
return CircularProgressIndicator();
}
},
),
ColDrawer(setIndex: (index) {
widget.setIndex(index);
},),
],
),
),
),
);
}
}
infoCard方法:
Future<Widget> infocard(AppUser userP) async {
var db = FirebaseFirestore.instance;
QuerySnapshot qn =
await db.collection('users').where('id', isEqualTo: userP.id).get();
return InfoCard(
username: userP.username,
age: userP.age,
weight: userP.measurements
.firstWhere((measure) => measure.title == 'Weight')
.datas
.last
.values
.first,
);
}
如果我不等待数据库被加载,或者如果我用InfoCard小部件替换FutureBuilder,它只会为userP.measurements.线路:
StateError (Bad state: No element)
最后,为什么我需要调用数据库,即使应用程序在Firestore数据库上启动时已经加载了所有数据?