简介
Pelorus 是一个用于管理 web 应用程序状态的简单 JavaScript 库。它的设计理念是“渐进式地管理你的状态”，也就是说你可以在不同的组件中随时引入 Pelorus 并使用它进行状态管理。Pelorus 提供了状态“装载”、“更新”、“卸载”等基础功能，并支持多种存储、常见语法和异步状态的处理。
安装
你可以通过 npm 进行安装：
--- ------- -------
示例
装载
Pelorus 像其他一些状态管理库一样，可以帮助你追踪各个组件的状态。首先，让我们安装并初始化一个 Pelorus 实例：
------ ------- ---- ----------
----- ------- - --- ---------
------ -
------ --
--
---这里我们创建了一个空的 Pelorus 实例，并且传入了一个 state，表示我们初始化时组件的状态。每个 Pelorus 实例都有一个 state 字段，表示状态数据的哈希表。接下来，我们将状态注入组件：
------ - -------- - ---- --------
-------- --------- -
----- ------- ------- - ----------- -- --------------------
------------------------ --------
-------- ----------- -
------------------------- --- -- -- ------ ------- - - ----
-
-------- ----------- -
------------------------- --- -- -- ------ ------- - - ----
-
------ -
-----
----------------------
------- ------------------------------
------- ------------------------------
------
--
-这里我们使用 React 做为视图框架，使用 useState() 将当前状态和更新器捆绑在一起。然后，我们调用 Pelorus 实例的 mount() 方法，注册该状态的组件。最后，我们将更新器作为参数，在更新状态时根据指定的状态名称获取该组件的所有实例。此时，每次应用更新，组件的状态都会被更新。
状态存储
使用 Pelorus 后，数据状态存储的方式很灵活。你可以存储状态在本地、远程，甚至是在一些云服务等等。这里展示一下如何将状态存储在 localStorage 中：
------ ------- ---- ----------
------ - -------- - ---- --------
----- ------- - --- ---------
-------- --------------------
------ - ------ - --
---
-------- --------- -
----- ------- ------- - ----------- -- --------------------
------------------------ --------
-------- ----------- -
------------------------- --- -- -- ------ ------- - - ----
-
-------- ----------- -
------------------------- --- -- -- ------ ------- - - ----
-
------ -
-----
----------------------
------- ------------------------------
------- ------------------------------
------
--
-注意：Pelorus 实例初始化时允许添加 storage 变量，并将当前状态存储在窗口对象的 localStorage 中。此时使用 Pelorus 的状态具有持久性，刷新后将保留它的状态。
异步状态处理
现实世界的应用有很多是由异步请求组成的。Pelorus 实例同样也支持异步请求，只要你愿意。
------ ------- ---- ----------
------ - --------- --------- - ---- --------
----- ------- - --- ---------
------ - ----- ---- --
---
-------- ----------- -
----- ------- ------- - ----------- -- --------------------
------------ -- -
----- -------- ----------- -
----- -------- - ----- ----------------------------------
----- ---- - ----- ----------------
---------------------- ------
-
------------
-- ----
------ -
-----
----------- - -
-------------------------------- -- ----------------------
- - -
---------------------
--
------
--
-这里使用 useEffect() 监听当前的状态，并在数据加载期间将状态设置为“Loading...”行文时。当数据加载完成后，使用 pelorus.update() 更新状态数据。这样使得 Pelorus 处理异步状态非常方便。
结论
Pelorus 可能不是最强大的状态管理工具，但它简单、小巧而且容易上手。
使用 Pelorus 可以让你在状态管理方面更高效、更方便。你可以以增量的方式使用它，在不同组件和应用程序间搭起一座稳定的桥梁。如果你刚刚开始学习前端开发，还没有用过状态管理，那 Pelorus 是一个不错的选择。
让我们在开发应用程序时将其纳入范围，并看看它如何帮助我们编写干净、清晰、简易的代码。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600551f181e8991b448cf70a