好消息,你在正确的轨道上。首先,您想要做的可能是将您的 Firestore 数据映射到您的数据模型。这可以通过创建从您的 Firestore 数据流映射的新流来完成:
final firebaseIdeaProvider = StreamProvider.autoDispose<List<Idea>>((ref) {
final stream = FirebaseFirestore.instance.collection('ideas').snapshots();
return stream.map((snapshot) => snapshot.docs.map((doc) => Idea.fromJson(doc.data())).toList());
});
现在剩下的就是阅读您的 StreamProvider。处理加载、错误和新数据状态的示例如下(使用hooks_riverpod):
class IdeasExample extends HookWidget {
const IdeasExample({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Ideas Example'),
),
body: useProvider(firebaseIdeaProvider).when(
loading: () => const Center(child: CircularProgressIndicator()),
error: (err, stack) => Center(child: Text(err.toString())),
data: (ideas) {
return ListView.builder(
itemCount: ideas.length,
itemBuilder: (_, index) {
return ListTile(
title: Text(ideas[index].toString()),
);
},
);
},
),
);
}
}
没有钩子:
class IdeasExample extends ConsumerWidget {
const IdeasExample({Key key}) : super(key: key);
@override
Widget build(BuildContext context, ScopedReader watch) {
return Scaffold(
appBar: AppBar(
title: Text('Ideas Example'),
),
body: watch(firebaseIdeaProvider).when(
loading: () => const Center(child: CircularProgressIndicator()),
error: (err, stack) => Center(child: Text(err.toString())),
data: (ideas) {
return ListView.builder(
itemCount: ideas.length,
itemBuilder: (_, index) {
return ListTile(
title: Text(ideas[index].toString()),
);
},
);
},
),
);
}
}