[英]Flutter Riverpod : Problems fetching data from Firebase using Riverpod
[英]How to fetch all documents from a firebase collection in Flutter using the Riverpod package?
我正在使用 provider 包并有一个提供者,它从一个全局变量 idea 中获取其初始值,它是一个 json 数据列表,类型为 List<Map<String, dynamic>>。
以下是该代码,它可以正常工作。
final ideasListProvider = StateNotifierProvider<IdeaList>((ref) {
return IdeaList([for (var i in ideas) Idea.fromJson(i)]);
});
现在我想要实现的是替换变量idea,而是使用我从firebase上的集合中获得的文档列表。
但我不确定如何从这里开始。
这是获取快照表单 firestore 的第二个提供程序。
final firbaseIdeaProvider = StreamProvider.autoDispose((ref) {
return FirebaseFirestore.instance.collection('ideas').snapshots();
});
现在我该怎么做? 我的其余代码依赖于 ideaListProvider,所以我必须以某种方式向它提供来自 firebase 上的想法集合的文档列表。
好消息,你在正确的轨道上。 首先,您想要做的很可能是将您的 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()),
);
},
);
},
),
);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.