前言
Redux 是一种 JavaScript 数据库，它帮助我们在应用程序中管理状态。随着 Redux 应用程序的扩展，我们可能会遇到一些障碍，例如：在调试应用程序时，我们需要知道每个操作发生的事件以及它们是如何更改状态的。
为了解决这些问题，有一种名为 redux-whathappened 的 npm 包，它为我们提供了一种轻松的方式来记录和调试 Redux 应用程序中的状态和行动。
在本文中，我们将学习如何使用 redux-whathappened 包。
安装
通过 npm 进行安装：
npm install redux-whathappened
安装完成后，您可以导入并使用它。
使用
redux-whathappened 包是一个 Redux 中间件，它记录了每个 Redux 操作，并将其打印到控制台。要使用它，我们需要将其添加到 Redux 存储中。
对于 Redux 存储的创建，我们假设您已经熟悉了如何创建 Redux 应用程序，并且拥有一些基本的知识。
要使用 redux-whathappened 包，我们需要做以下四个步骤：
- 导入
createWhatHappenedMiddleware。
import { createWhatHappenedMiddleware } from 'redux-whathappened';- 创建
createStore。
-- -------------------- ---- -------
------ - ------------ ---------------- --------------- - ---- --------
-- ----- --------
------ ------------ ---- -----------------
-- -----
----- ---------------------- - -------------------------------
----- ----- - ------------
-----------------
------ ------------ -- --- ------------ --- -------
---
---------------------------------------
--- 执行 Redux 动作。
store.dispatch({ type: ADD_TODO, payload: 'Use redux-whathappened' })- 在控制台中查看输出。
-- -------------------- ---- -------
-- --- ------ ----
-
------- -----------
---------- ---- --------------------
---------------- -
------------ ---------------------------
------------- -
-
------- ------------------
------- ----
------- ---------------------------------------------------------------
--
---
-
-
-我们可以看到，使用 redux-whathappened 包记录的每个操作都带有 _whatHappened 属性，在控制台中很容易看到。
示例代码
您可以在 Redux 应用程序中使用以下示例代码：
-- -------------------- ---- -------
------ - ---------------------------- - ---- ---------------------
------ - ------------ ---------------- --------------- - ---- --------
-- --
----- ------------ - -
------ --
--
-- -----------------
----- ------------ - ------ - ------------- ------- -- -
------ ------------- -
---- -----------
------ -
---------
------ ---------------- ---------------
--
--------
------ ------
-
-
-- -----
----- ---------------------- - -------------------------------
-- ------------------- ---------------
----- ----- - ------------
-----------------
------ ------------
---
---------------------------------------
--
-- -------
---------------- ----- ----------- -------- ---- ------------------- ---
------------------------------结论
在本文中，我们学习了如何使用 redux-whathappened 包记录和追踪 Redux 应用程序中的操作。使用它，我们可以更好地调试应用程序，并更清楚地了解应用程序中的状态更改。该包与常用调试工具（例如 Redux DevTools）兼容，并且易于使用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006700de361a36e0bce8ccb