ReactFire / Firebase 挂钩放置

Question

我想知道在中型应用程序中组织reactfire 挂钩（例如useUser 或useFirestoreCollectionData）的好方法：

1. 我可以将钩子放在顶级组件中，然后将此信息作为道具传递给子组件（或使用Context 来存储状态）。
2. 我可以在需要时在每个组件中放置钩子，这样我最终会得到多个 useUser 或 useFirestoreCollectionData 钩子。

第二种方法解耦了一些组件，这很好，因为我们的项目正在积极开发中。

但是，与SWR 或react-query 等库相比，我不确定reactfire 或firebase 客户端库是否具有内置重复数据删除功能。我希望尽量减少不必要的阅读。

Answer 1

在使用Firebase 数据库时，我喜欢使用offline first 方法。所有可用的库都不能满足我们的需求，所以我制作了自己的提供者列表，其中所有的提供者都是解耦的。主要目标是：

• 无论应用是否在线，所有数据都可以离线使用（这也会增加用户的响应时间）
• 为 RTDB 和 Firestore 持久化实时监听器 例如，当您有一个列表并转到单个项目并返回时，您可能不想在离开该列表组件时停止侦听器并在返回时再次启动它。如果您停止并启动它，firebase SKD 将从数据库中加载所有数据。

您可以找到提供程序和example 应用程序here。