简介
redux-fatigue是一个基于redux的状态管理库，通过简化redux中的代码结构来减少开发者在处理redux时的疲劳度（fatigue）。该库提供了一些有用的功能来辅助开发者更轻松地使用redux，例如：
- 快速创建reducer（reducer factory）
- 提供redux中间件
- 支持状态持久化
安装
你可以通过npm来安装该库，以下是安装命令：
npm install redux-fatigue --save
一旦安装完成，你就可以在你的代码中使用redux-fatigue了。
创建Reducer
为了创建一个基于redux-fatigue的reducer，你可以使用提供的reducer factory函数。reducer factory是一个带有辅助方法的标准redux reducer的封装，它简化了redux的开发流程。以下是一个例子：
-- -------------------- ---- -------
------ - -------------------- - ---- ----------------
----- --- - ------
----- ------------ - -
------ --
--
----- -------------- - ----------------------------------
------------ ------- ------- -- --
------ ----------- - ---------------
----
------ ------- ---------------在上面的代码示例中，我们使用createReducerFactory函数来创建了一个reducer工厂，这个reducer工厂初始化了一个初始状态对象。接下来，我们可以在reducer工厂中调用handle方法来将一个动作类型（ADD）和一个处理方法（该方法在接收动作时返回新的状态对象）进行绑定。最后，我们导出了reducer factory。
你也可以在reducer工厂中定义多个处理程序，这样你就可以更好地处理各种动作类型。下面是一个例子：
-- -------------------- ---- -------
------ - -------------------- - ---- ----------------
----- --- - ------
----- ------ - ---------
----- ------------ - -
------ --
------ ---
--
----- -------------- - ----------------------------------
------------ ------- ------- -- --
------ ----------- - ---------------
---
--------------- ------- ------- -- -
----- ------ - ---------------
----- -------- - ------------------------- -- ------- --- --------
------ -
---------
------ ---------
--
---
------ ------- ---------------上述示例定义了两个处理程序，第一个处理程序处理ADD动作并更新计数器，第二个处理程序处理DELETE动作并且从项目数组中删除给定ID的项目。
提供Redux中间件
redux-fatigue还提供了一些额外的中间件，以便让你更加便捷地使用redux。以下是一些redux-fatigue中间件相关的讨论。
Redux Thunk 中间件
redux-fatigue提供了一个redux-thunk中间件，以便使用异步处理器。如果你不熟悉redux-thunk，它是一个许多开发者在redux中使用的最流行的中间件实现之一。
你可以使用redux-thunk来产生具有副作用的方法，这些副作用可以在方法完成时触发动作，并且将异步逻辑拆分为单个函数。
以下是如何将redux-thunk中间件应用到redux-fatigue上的示例：
-- -------------------- ---- -------
------ - ---------------- ----------- - ---- --------
------ - --------------------- ----- - ---- ----------------
----- --------- - -- -- -
------ ----- ---------- -- -
-- ------- --
---------- ----- ------------------ -------- ---- ---
--
--
----- -------------- - ----------------------------------
-------------------------- ------- ------- -- --
---------
----- ---------------
----
----- ----- - ------------------------------------------- ------------------------
----------------------------上述示例定义了一个fetchData方法，该方法使用异步逻辑（例如，调用api）来获取数据。使用该中间件，我们可以将该方法转化为返回另一个具有dispatch参数的函数。此函数在异步逻辑完成后将触发一个动作。
Redux Logger 中间件
还有一个redux-logger中间件，它用于记录redux状态更改和动作。以下是如何在redux-fatigue中使用：
-- -------------------- ---- -------
------ - ---------------- ----------- - ---- --------
------ - --------------------- ------ - ---- ----------------
----- -------------- - ----------------------------------
------------ ------- ------- -- --
------ ----------- - ---------------
---
--------------- ------- ------- -- -
----- ------ - ---------------
----- -------- - ------------------------- -- ------- --- --------
------ -
---------
------ ---------
--
---
----- ----- - ------------------------------------------- -------------------------Redux DevTools 中间件
redux-fatigue还包含了一个包装在redux-devtools中协议中的中间件，可以让你在浏览器中使用redux-devtools来调试状态。以下是如何在redux-fatigue中使用它：
-- -------------------- ---- -------
------ - ---------------- -------- ----------- - ---- --------
------ - --------------------- -------- - ---- ----------------
----- -------------- - ----------------------------------
------------ ------- ------- -- --
------ ----------- - ---------------
----
----- ----- - ------------
-------------------------------
-----------------------------------
--状态保存
redux-fatigue还提供了一些实用的状态保存和加载方法。如果你想让你的应用程序可以在用户关闭浏览器之后重新加载并恢复之前的状态，那么你可以使用该库提供的方法。
持久化到LocalStorage或Session Storage
你可以使用persist方法来将你的状态持久化到本地存储区域（local storage或session storage）中。以下是一个示例：
-- -------------------- ---- -------
------ - --------------------- ------- - ---- ----------------
----- ------------ - -
------ --
--
----- -------------- - ----------------------------------
------------ ------- ------- -- --
------ ----------- - ---------------
----
----- ---------------- - ----------------- --------------------------------在上述示例中，我们使用persist方法将reducer与支持localStorage或sessionStorage的本地存储结合起来。你可以为你的持久化状态指定一个特定的键名（在本例中为“my-app”）。
持久化到IndexedDB
如果你想将你的状态持久化到IndexedDB中，则可以使用idb方法。以下是一个示例：
-- -------------------- ---- -------
------ - --------------------- --- - ---- ----------------
----- ------------ - -
------ --
--
----- -------------- - ----------------------------------
------------ ------- ------- -- --
------ ----------- - ---------------
----
----- ---------------- - ------------- --------------------------------上述示例中，我们通过使用idb方法来将reducer与支持IndexedDB的本地存储结合起来。你可以为你的持久化状态指定一个特定的键名（在本例中为“my-app”）。
结论
redux-fatigue是一个为开发者简化redux开发流程的库。它提供了一些有用的功能，例如reducer工厂和各种redux中间件（如redux-thunk，redux-devtools和redux-logger）。此外，它还提供了一些有用的方法来支持状态的持久化和恢复，以使你的应用程序可以保留用户的状态。如果你正在使用redux，并且希望减轻redux中的疲劳度，那么redux-fatigue是一个值得尝试的库。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006700de361a36e0bce8c90
