Redux-Firebase 是一个基于 Redux 的 Firebase 绑定库，它将 Firebase 实时数据同步到 Redux store 中，使得 Redux 的状态可以通过 Firebase 进行持久化。
快速开始
在使用 Redux-Firebase 前，必须先安装 Firebase 和 Redux。然后运行以下命令安装 Redux-Firebase：
npm install --save redux-firebase firebase redux
在应用程序中创建一个 Reducer 并使用 combineReducers 函数将此 Reducer 与其他 Reducer 组合：
-- -------------------- ---- ------- ------ - --------------- - ---- -------- ------ - --------------- - ---- ----------------- ------ - -- ---- ----- -------- -- - ---- ------------- ----- ----------- - ----------------- --------- ---------------- -- ---- ----- -------- -- --- ------ ------- ------------
使用 react-redux 的 Provider 组件包裹应用程序根组件，并将 redux-firebase 和 firebase 配置传递给 react-redux-firebase：
-- -------------------- ---- -------
------ ----- ---- --------
------ -------- ---- ------------
------ - -------- - ---- --------------
------ - -------------------------- - ---- -----------------------
------ -------- ---- ---------------
------ --------------------
------ - ----------- - ---- --------
------ ----------- ---- -------------
----- -------------- - -
-- ---- -------- ------------- --
--
---------------------------------------
----- ------------ - --
----- ----- - ------------------------ --------------
----- --------- - -
------------ --------
-------------- ------
--
----- -------- - -
---------
------- ----------
--------- ---------------
--
----------------
--------- --------------
--------------------------- --------------
--- ---- --- ---- --------- ---
-----------------------------
------------
-------------------------------
--现在，你可以在组件中使用 Redux 和 Firebase：
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ - ------- - ---- --------------
------ - --------------- - ---- -----------------------
----- --- ------- --------- -
------- - -- -- -
----- - --------- ----- - - -----------
----- ------- - -
----- ------ ----------------
--------- ------
--
---------------------- ---------
-
-------- -
----- - ----- - - -----------
------ -
-----
----
------ -- ---------------- ------ -- -
--- ------------
----------- - -------------- - ---------- - -------------
-----
---
-----
------- -------------------------- -------------
------
--
-
-
----- ------- - --------
--------------- -- --
------ -----------------------------
----
-----------------
-------
---
--
------ ------- -------------在组件中使用 firebaseConnect HOC 来将 Firebase 数据与 Redux state 连接起来。在上述示例中，我们将 'todos' 路径下的数据同步到 Redux store 中。使用 connect 函数来将 Redux state 映射到组件的属性上。
现在，你已经可以使用 Redux-Firebase 实时同步 Firebase 数据到 Redux store 中，而且在浏览器刷新后 Redux state 也可以持久化到 Firebase 中，实现了状态的可持久化。
结论
Redux-Firebase 是一个功能强大且易于使用的库，它将 Firebase 数据同步到 Redux store 中，并实现了状态的可持久化，可以在 Web 应用程序中实现高效且可扩展的状态管理。希望这篇文章对你使用 Redux-Firebase 有所帮助，谢谢阅读。
完整示例代码：https://github.com/99robots/redux-firebase-demo
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006700de361a36e0bce8cd5