简介
storry 是一个基于 React 实现的轻量级状态管理工具，它可以让你快速简单的管理你的应用程序状态，并且与 React Hook API 结合得非常完美。
安装
在您的 React 项目中使用 npm 安装 storry，打开终端运行：
npm install storry
快速开始
在您的代码中引入 Provider 和 useStorry：
-- -------------------- ---- -------
------ ----- ---- --------
------ - --------- --------- - ---- ---------
-------- ----- -
------ -
----------
-------- --
-----------
--
-创建一个状态管理器，并将其导出：
-- -------------------- ---- -------
------ ----- ------------ - -- -- -
----- ------- --------- - -----------------
------ -
------
---------- -- -- ---------- -- - - ---
---------- -- -- ---------- -- - - ---
-
-使用 useStorry 钩子获取状态并操作数据：
-- -------------------- ---- -------
------ ----- ---- --------
------ - --------- - ---- ---------
------ - ------------ - ---- ----------
-------- --------- -
----- - ------ ---------- --------- - - -----------------------
------ -
-----
----------------
------- ------------------------------
------- ------------------------------
------
--
-
------ ------- --------原理解析
storry 是一个类似于 React Context API 的状态管理工具，它通过 Provider 来提供和传递 store（状态）给子组件使用，通过 useStorry 钩子获取对应的 store，并使用 useState 钩子对其进行订阅，当 store 发生变化时重新渲染组件。
同时，storry 还支持异步数据的处理，它提供了 useAsyncStorry 钩子用于获取 store，以及一个 effect 函数用于处理异步数据。
案例示范
创建一个用户管理页面，它可以展示用户列表和添加用户：
-- -------------------- ---- -------
------ ----- ---- --------
------ - --------- ---------- -------------- - ---- ---------
-------- ----- -
------ -
----------
----- --
-----------
--
-
------ ----- --------- - -- -- -
----- ------- --------- - ------------------
----- ---------- - ----- -- -- -
----- --- - ----- ---------------------------------------------------
----- ---- - ----- ----------
--------------
-
----- ------- - ------ -- -
------------------- ------
-
------ - ------ ----------- ------- -
-
-------- ------ -
----- - ------ ------- - - --------------------
----- - -------- ------ --------- - - -------------------------
------------------ -- -
-----------
-- ---
----- ------------ - --- -- -
------------------
--------- ----- -------------------- --
-------------------- - --
-
------ -
-----
----- ------------------------
------ ----------- ------------ --
------- ----------------- -------------
-------
---------------
- ------- -- ----------------- -
- ----- -- ---------------------- -
- -------------- -- -- ------------------------------ -
------
-
-
------ ------- -----如上述代码所示，我们可以轻松地通过 storry 管理我们的应用程序状态，并且实现非常好的数据交互和页面展示效果。
总结
storry 是一个非常简单易用的状态管理工具，它可以极大的简化我们的开发流程，规范我们的代码结构，并且让我们更加专注于业务实现。如果你正在寻找一个新的状态管理机制，那么 storry 绝对是一个值得尝试的工具。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005596081e8991b448d6cea