简介
reducer-in-action 是一个轻量级的 npm 包，它能帮助你快速构建 Redux 应用程序，同时减少大量重复的代码。这个包的主要目的是将 Redux reducer 和 action 两个概念结合起来，让你可以在每个 reducer 文件中创建 action creator 功能，与此同时又保持了 Redux 广泛共享的单一状态树模式。
安装
在你的项目目录中使用如下命令进行安装：
npm install reducer-in-action
使用
创建 reducer
假设你需要创建一个名为 counter 的 reducer 文件，可以使用如下 API 创建 reducer：
-- -------------------- ---- -------
------ - ------------- - ---- --------------------
------ ----- --------- - ------------
------ ----- --------- - ------------
----- ------------ - -
------ --
--
------ ------- --------------------------- -
------------ ----- -- --
------ ----------- - --
---
------------ ----- -- --
------ ----------- - --
---
---创建 Action
我们为计数器应用程序创建一个名为 actions.js 的文件，其中包含 ActionTypes 和一个名为 createAction 的导出函数，该函数创建一个新的 Action Creator。
export const INCREMENT = 'INCREMENT'; export const DECREMENT = 'DECREMENT'; export const increment = createAction(INCREMENT); export const decrement = createAction(DECREMENT);
这个输出变量 increment 和 decrement 将创建 action 对象，并返回 type 和 payload 属性，例如：
{
type: INCREMENT,
}使用 reducer 和 action
通过结合 createAction 和 createReducer，我们可以很容易地编写对 counter 应用程序的测试代码：
-- -------------------- ---- -------
------ - ---------- --------- - ---- ------------
------ ------- ---- ------------
----------------- --------- -- -- -
---------- ------ ------- ------- -- -- -
-------
------------------ - ----- --------- --
----------- ------ - ---
---
---------- ------ ----------- -- -- -
-------
--------- ------ - -- ------------
----------- ------ - ---
---
---------- ------ ----------- -- -- -
-------
--------- ------ - -- ------------
----------- ------ - ---
---
---总结
reducer-in-action 是一个非常有用的 npm 包，可以帮助你更加容易地编写 reducer 和 action，同时还能减少许多重复的代码。我们可以通过 createAction 和 createReducer 函数快速地创建 reducer 和 action。此外，组合这两个 API 还能通过测试代码确保程序的正确性。希望这篇教程对前端开发者学习 Redux 有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056cdc81e8991b448e68ac