在 React 开发中，Redux 是一种用于管理应用程序状态的强大工具。Redux 的创立使得应用程序状态的管理变得更加简单、可预测和可控。在 Redux 中，唯一可以修改应用程序状态的方法是发出操作(action)。当操作发出时，Redux 会派发给存储状态的 reducer 函数。reducer 函数基于操作的类型更新存储状态，以便反映最新的应用程序状态。然而，在 Redux 开发中有时会出现难以调试的错误。因此，Redux 提供了一个严格模式(strict mode)来帮助开发人员更好地调试应用程序。
Redux 严格模式是什么
Redux 严格模式是一种开发者工具，它提供了一个严格的应用程序执行环境。当开启严格模式时，Redux 会对应用程序执行进行严格的限制。如果应用程序执行中触发了可疑的操作，Redux 将会发出一个警告信息，让开发者能够更好地调试应用程序。严格模式会对执行性能产生一些影响，所以只应该在开发和调试阶段开启它。
如何在 Redux 中开启严格模式
开启 Redux 严格模式很简单，只需要在创建 store 对象时，将 enhancer(增强器) 参数设置为 applyMiddleware() 函数的第三个可选参数即可：
-- --------- ------ - ------------ --------------- - ---- ------- ------ ----- ---- ------------- ------ ------ ---- -------------- ------ ----------- ---- --------------- -- -- ------ --- ----- ----------- - ------- ------- -- ---- ----- ----- ----- - ------------ ------------ -------------------------------- ----------------------------------- -- ------------------------------------- -
在上述代码中，我们在 applyMiddleware() 函数的第三个可选参数中开启了 Redux 严格模式。开启严格模式后，在执行出现问题时会更容易发现问题。下面是一个示例，来演示在使用严格模式后，Redux 如何发现这些问题。
一个例子
假设在我们的应用程序中，有一个计数器组件。计数器组件使用 Redux 中的 state 来管理计数器的值，而且支持我们增加或减少计数器值。我们的代码看起来像这样：
------ ------ - --------- - ---- -------
------ - ------- - ---- -------------
------ - ---------- --------- - ---- ------------
----- ------- ------- --------- -
-------- -
----- - ------ ---------- --------- - - ----------
------ -
--
------- -------------------------------
--------------------
------- -------------------------------
---
-
-
-
----- --------------- - ------- -- --
------ ------------
--
----- ------------------ - -
----------
----------
-
------ ------- ------------------------ ----------------------------现在，我们已经创建了组件并连接到 Redux，但是我们有一个问题：当我们尝试去减小计数器的值到达 0 时，它却能够继续减少，一直到变成了负数。这是一个错误，我们需要一个方法来验证这个问题。作为一种解决方法，我们可以开启 Redux 严格模式并从控制台查看警告信息。
首先，我们需要在创建应用程序的 store 时开启严格模式。在下面的代码中，我们添加了一个中间件，用于检测应用程序中的问题：
----- ----------- - ------- -------
-- ---- ----- ------ ----- ----
----- ----- - ------------
------------
------------------------------- -------- --------- -------- -- -
------ -------------- -
------ ---------------- -
----- --------- - ----------
----- ------ - ------------
----- --------- - ----------
----- --------- - ------------------------ - ----------------
-- ---------- - -- -
--------------------- --- ------- ---- ---------- --------
-
------ ------
-
-
---
----------------------------------- -- -------------------------------------
-在代码中，我们使用一个新的中间件 checker 来检查组件执行时的问题。在环境中开启 Redux 严格模式后，我们将捕捉错误并检测组件的状态。
现在，当我们测试应用程序并将计数器减少到 0 时，我们可以在控制台中看到以下警告信息：
------- --- ------- -- - -----
Redux 掌握了我们更新的内容，并验证了计数器是否受到不正常的更改。而这正是 Redux 严格模式的目的。
结论
总结一下，Redux 严格模式可以帮助我们在开发和调试时更好地理解应用程序的行为。使用严格模式，我们可以发现有问题的操作，并从控制台中查看警告信息。开启 Redux 严格模式后，我们不会遇到隐藏问题和类似的困境，因此，强烈建议你在开发和调试过程中开启它。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6496760548841e98943a24bc