介绍
@jupyterlab/observables 是一个 JupyterLab 的 observable 套件的集合，为使用observable对于 JupyterLab的 frontend创建工作流提供简便的手段，让强大的前端框架虚拟 DOM 库 React 应用流程更加容易。在本文中，我将详细介绍如何使用 @jupyterlab/observables npm 包以及如何在 JupyterLab 中应用虚拟 DOM 库 React。
安装
在你的项目中你可以通过 npm 命令进行安装：
npm install @jupyterlab/observables
初始化
你需要在你的项目中导入 ObservableJSON 和 ObservableValue 对象，并使用 fromJSON 从 JavaScript 对象中生成 ObservableJSON：
-- -------------------- ---- ------- ------ - --------------- ---------------- --------------- - ---- -------------------------- --- ----- --------------- - --- --- ----- -------------- - --- ---------------- ------- ---- --- --- ------ - --- -------------------- --- -------- - --- -------------------- ----------------------- -- - --- -- - ------------------- --- ---- - --------------------- ------------- -- -------- ----------------- -- -------- --- --- -------- - -- -- - ------------------ ---------- -------------------- ------- - -----------
用例
你可以把 @jupyterlab/observables 用于简化应用的结构，这样应用便可以更清爽地表达其状态：
-- -------------------- ---- -------
------ - -- ----- ---- --------
------ - --------------- - ---- --------------------------
--------- ----- -
--------- -------
------ -------
------ -------
-
----- -------- ------- ------------------- ------ -
--------- ----------------
------ ----------------
------ ----------------
------------------ --- -
------------
------------- - --- --------------------
---------- - --- --------------------
---------- - --- --------------------
-
------------ - --- ---- -- -
-------------------
----- - --------- - ------ -------- -- ------ - ------ ----- -- ------ - ------ ----- - - - -----
------------- --------- ------ ----- ---
-
-------------- - --- ---- -- -
----- - ------- - ----- ----- - - - --
----------------------
-
-------- -
------ -
----- -----------------------------
---- -----------------------
------ -----------------------------------
------ ----------- ------------------------ ------------- --------------------------- ------------------------------ --
------
---- -----------------------
------ --------------------- ---------------
------ ------------ ------------------------ ---------- ------------------------ ------------------------------ --
------
---- -----------------------
------ -----------------------------
------ ------------ ------------------------ ---------- ------------------------ ------------------------------ --
------
------- ------------- -------------- ----------------------------
-------
--
-
-
------ ------- ---------这个表单除了用于输入个人信息，同时也可以通过 observables 将表单元素与这个组件的状态进行绑定。
通过这个方法，你便可以更自然地处理组件状态，并减少不必要的模板代码。同时也容易处理上交应用的开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f1f8a26403f2923b035c5f7