说明
在前端开发中尤其是响应式应用开发中，状态管理一直是一个棘手的问题。不同的框架和库选择不同的方式来解决这个问题。而 Cycle.js 框架通过数据流（Data flows）的方式来解决这个问题。cycle-gun 是 Cycle.js 的一个 npm 包，它可以将 Gun.js 图形数据库和 Cycle.js 框架结合使用来解决前端应用的状态管理。
准备
在使用 cycle-gun 之前，我们需要先安装 Cycle.js 和 Gun.js。
npm install @cycle/dom @cycle/run gun cycle-gun
基本使用
- 通过调用 gun() 方法，将 Gun 数据库集成到应用程序中。
-- -------------------- ---- -------
------ ----- ---- -------------
------ ----- ------ -------------- ---- -------------
------ ----- ---- ------------
-------- ------------- -
----- ------ - ---------------------------------------------
----- ----------- - ---------------- -- --------------------
----- ------ - ---------------------------------- --
-----
------------ ------- ------ -------- --------
-------------- ------ -----------
--
--
----- --- - --------------------- -- -
----- ---- - ---
------------- - ------
------ ----------------------
---
------ -
---- -------
---- ---
--
-
--------- -
---- ----------------------
---- -----
---- 在应用程序中使用 Gun 数据库。
-- -------------------- ---- -------
------ ----- ---- -------------
------ ----- --- -------------- ---- -------------
------ ----- ---- ------------
-------- ------------- -
----- ----------- - -------------------------
----- ---------- - --------------------- --
-----
--------- -----------
---------- ----- ---- --- ---- -- --- -------
--
--
----- --- - -----------------
------ ----------
---
------ -
---- -----------
---- ---
--
-
--------- -
---- ----------------------
---- -----
---高级使用
在 cycle-gun 中，我们可以使用 combineLatest 和 连接操作符 （&）组合多个 Gun 数据库中的查询来处理一组相关联的数据。
-- -------------------- ---- -------
------ ----- ---- -------------
------ ----- --- --- --- -------------- ---- -------------
------ ----- ----------- ---- ------------
-----------------
-------- ------------- -
----- ------------ - --------------------------------------
----- --------------- - -----------------------------------------
----- ----------- - ----------------------- --
--------------------------- --
------------------------------------------ -- --
---- ----
----- ----------
----- ----------
---------- -----------
---
-
-------------------- -- ----------------------------------------
---------- --
----------------- --
----
---------------
--------------- --------------------
---------- --------------
--
--
--
----- -------------- - ----------------------------- --
------------------------------ --
------------------------------------------ -- --
---- ----
----- ----------
----- ----------
---------- --------------
---
-
-------------------- -- ----------------------------------------
---------- --
----------------- --
----
---------------
--------------- --------------------
---------- --------------
--
--
--
------ -
---- ---------------------------------------- --------------------------- ------- --
-----
--------- ------- ------- ------- --------------- ----------
---------- ------- ------- ---------
--
--
---- ---------------------------------------- ---------------
-
-
--------- -
---- ----------------------
---- -----
---我们还可以使用响应式的数据流进行数据处理，这样可以很好地解决多 async 数据的情况。这里我们结合使用了 xstream 和 rxjs。
-- -------------------- ---- -------
------ -- ---- ----------
------ ----- ---- -------------
------ ------ ---- ---------------
------ ----- ----------- ---- ------------
------ ---- ---- -------
------ ------- ---- ----------
------ --------- ---- -------------------------
------ ---------------- ---- --------------------------------
------ ----- ---- ---------------------
-----------------
-------- ------------- -
----- --- - ------------
----- ----- - --
---------
--------------------------------------------
--------------------------------------------
-------------------------------------------
-
----------------- -- -------------------- ----
----- ----- - --------------------------------------------------------- ------ ----
----- ----- - ---------------------------------------------------------- -- -------
----- ----- - --------------------------------------------------------- ------ -- -------
----- ------- - -------------------- ------ ------------------- --
-------------------------
---------------
----------------- -- -
----- ---- - ---
--------- - ----------- - ------- - ----------- - --------
--------- - ----------- - ------- - ----------- - ---
--------- - ----------- - ----------- - ---
------ -----
--
--
-------------- ------ -- -
------ --------------
--
-
-----------------------------
------ -
---- ----------------- --
-----
------------------
------- ----------------- ----------
------- ----------------- ----------
------- ----------------- ----------
------
--
---- -------
--
-
--------- -
---- ----------------------
---- -----
---结语
cycle-gun 的使用需要正确的理解 Cycle.js 框架和 Gun.js 数据库的运作方式，同时使用起来也带有一定的复杂性。但使用 cycle-gun 可以很好地解决响应式应用开发中的状态管理问题，尤其是在使用多异步数据时更为实用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600572cc81e8991b448e8fce