在 React Native 应用程序中，有时需要处理大量的状态。这些状态可能在整个组件树中传递，导致代码难以维护和调试。这是 Redux 可以帮助我们的。
Redux 是一个 JavaScript 应用程序状态管理库，它可以帮助我们管理 React Native 应用程序中的状态，并使这些状态易于访问和共享。本文将介绍如何在 React Native 应用程序中使用 Redux 进行状态管理。
安装 Redux
首先，我们需要安装 Redux。在终端中运行以下命令：
npm install --save redux react-redux
创建Redux store
Redux 中最重要的概念之一是 store，它是我们应用程序的状态容器。 Redux 应用程序中的所有状态都存储在 store 中。我们可以使用 createStore 函数来创建一个 store。
-- -------------------- ---- -------
------ - ----------- - ---- --------
----- --------- - ------ - --- ------- -- -
------ ------------- -
---- -----------
------ ---------- ----------------
---- --------------
------ ----------------- -- ------- --- -------------------
--------
------ ------
-
--
----- ----- - -----------------------代码解析:
- createStore 函数接收一个 reducer 函数，该函数定义了如何处理 action 和更新存储的状态。在这个示例中，我们的 reducer 函数 myReducer 处理两种不同类型的 action：ADD_ITEM 和 REMOVE_ITEM。
- reducer 函数接收一个状态和一个 action 对象，并根据 action 的类型生成一个新状态。
- createStore 函数会使用这个 reducer 函数创建一个存储，并将其设置为全局对象。
连接 store 和 React Native 应用程序
Redux store 创建完毕，现在需要将其连接到 React Native 应用程序中。
这时，我们需要使用 provider 函数提供 Redux store。 Provider 通过 React 的上下文传递存储，以使 store 在组件层次结构中可用。
-- -------------------- ---- -------
------ - -------- - ---- --------------
----- --- - -- -- -
------ -
--------- --------------
------------ --
-----------
--
--从 store 中提取状态
现在，可以从 Redux store 中获取应用程序状态并在 React Native 组件中使用它。
使用 connect() 函数进行状态提取。
- mapStateToProps 函数声明使用的 state 中的哪些部分，这些部分将作为 props 传递到有状态组件。
- mapDispatchToProps 函数定义要以何种方式更新状态。
-- -------------------- ---- -------
------ - ------- - ---- --------------
----- ----------- - ----- -- -
----- - ------ -------- ---------- - - ------
------ -
------
---------
------------
-------------- ---- -- -- -
--------- ------------------ ----------- -- ----------------- --
--
--
------- ---------- ----- ----------- -- --------- --- ----------- ------ ----- -------------- --- --
-------
--
--
----- --------------- - ----- -- -
------ -
------ -----
--
--
----- ------------------ - -------- -- -
------ -
-------- ---- -- -
---------- ----- ----------- -------- ---- ---
--
----------- ---- -- -
---------- ----- -------------- -------- ---- ---
-
--
--
------ ------- ------------------------ ---------------------------------使用上述方法，我们可以将 Redux store 用于 React Native 应用程序中的状态管理。
总结
Redux 是一种广泛使用的 JavaScript 应用程序状态管理库，可帮助处理 React Native 应用程序中的状态。使用 createStore 函数来创建 Redux store，使用 provider 提供 store 给组件树，使用 connect 函数从 store 中提取状态，并使用 mapStateToProps 和 mapDispatchToProps 函数定义组件的 props。
这些用法将使 React Native 应用程序更容易的进行状态管理, 方便团队协作.
示例代码
完整代码可以参考:
-- -------------------- ---- -------
------ ----- ---- --------
------ - ----- --------- ------ - ---- ---------------
------ - -------- - ---- ------------------------
------ - ----------- - ---- --------
------ - --------- ------- - ---- --------------
----- --------- - ------ - --- ------- -- -
------ ------------- -
---- -----------
------ ---------- ----------------
---- --------------
------ ----------------- -- ------- --- -------------------
--------
------ ------
-
--
----- ----- - -----------------------
----- --- - -- -- -
------ -
--------- --------------
------------ --
-----------
--
--
----- ----------- - ----- -- -
----- - ------ -------- ---------- - - ------
------ -
------
---------
------------
-------------- ---- -- -- -
--------- ------------------ ----------- -- ----------------- --
--
--
------- ---------- ----- ----------- -- --------- --- ----------- ------ ----- -------------- --- --
-------
--
--
----- --------------- - ----- -- -
------ -
------ -----
--
--
----- ------------------ - -------- -- -
------ -
-------- ---- -- -
---------- ----- ----------- -------- ---- ---
--
----------- ---- -- -
---------- ----- -------------- -------- ---- ---
-
--
--
------ ------- ------------------------ ---------------------------------参考链接:
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6491820148841e9894f89eb6