介绍
@vutr/redux-zero 是一个开源的零依赖状态管理库，它可以帮助你更好地管理应用中的状态。
它提供了一个简单的 API，可以使状态管理更加容易，并且不需要使用 Redux 的特定语法。Redux-zero 支持 React，Vue，Angular 和任何其他 JavaScript 应用程序。
安装和使用
安装
要安装 @vutr/redux-zero，您可以使用 npm。
npm install @vutr/redux-zero
创建 store
建议将您的所有 store 文件放在一个目录中。当您就开始创建 store.js 时，可能会像下面这样：
-- -------------------- ---- ------- ------ ----------- ---- ------------------- ----- ------------ - - ------ - -- ----- ----- - -------------------------- ------ ------- ------
*这只是一个基础的 store。
使用 store
-- -------------------- ---- -------
------ ----- ---- --------
------ ----- ---- ----------
----- ----------- - -- -- -
----- - ----- - - -----------------
----- --------- - -- -- -
---------------- ------ ----- - - ---
--
----- --------- - -- -- -
---------------- ------ ----- - - ---
--
------ -
-----
---------- ------------
------- --------------------------------------
------- --------------------------------------
------
--
--
------ ------- ------------在这个例子中，我们展示了如何获得 store 的状态和如何更新状态。我们在组件中使用 store.getState() 方法获得当前的状态，并使用 store.setState() 方法来更新它。
使用 combineReducers
可以使用 combineReducers 来管理 store 中的多个状态。
-- -------------------- ---- -------
------ ------------ - --------------- - ---- -------------------
----- ---------------- - -
----- ---
---- ----
--
----- ------------------- - -
---- ---
--------- --
--
----- --------------- - ------ - ----------------- ------- -- -
------ ------------- -
---- -----------
------ - --------- ----- -------------- --
---- ----------
------ - --------- ---- -------------- --
--------
------ ------
-
--
----- -------------- - ------ - -------------------- ------- -- -
------ ------------- -
---- ----------
------ - --------- ---- -------------- --
---- ---------------
------ - --------- --------- -------------- --
--------
------ ------
-
--
----- ------------ - -
----- -----------------
-------- -------------------
--
----- ----------- - -----------------
----- ----------------
-------- --------------
---
----- ----- - ------------------------- -------------
------ ------- ------在这个例子中，我们展示了如何使用 combineReducers 来创建多个 reducers，它们都被包含在一个根 reducer 中。我们还展示了如何在 store 中使用多个状态。
示例
请查看以下示例代码块以获取更多帮助。
React 示例
-- -------------------- ---- -------
------ ----- ---- --------
------ ----- ---- ----------
----- ----------- - -- -- -
----- - ----- - - -----------------
----- --------- - -- -- -
---------------- ------ ----- - - ---
--
----- --------- - -- -- -
---------------- ------ ----- - - ---
--
------ -
-----
---------- ------------
------- --------------------------------------
------- --------------------------------------
------
--
--
------ ------- ------------在这个 React 示例中，我们展示了如何使用 @vutr/redux-zero 在 React 组件中管理状态。
Vue 示例
-- -------------------- ---- -------
----------
-----
---------- -- ----- -------
------- -------------------------------------
------- -------------------------------------
------
-----------
--------
------ ----- ---- ----------
------ ------- -
----- --------------
------ -
------ -
------ ----------------------
--
--
-------- -
----------- -
---------------- ------ ---------- - - ---
-------------
--
----------- -
---------------- ------ ---------- - - ---
-------------
-
--
--------- -
--------------------- -- -
---------- - ------------
---
-
--
---------在这个 Vue 示例中，我们展示了如何使用 @vutr/redux-zero 在 Vue 组件中管理状态，并如何订阅状态更改。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600672e70520b171f02e1e18