如果你在开发前端应用程序的时候使用了 Knockout.js 这个框架，你可能已经遇到过需要管理活动状态的需求。shimney-knockout 为 Knockout.js 应用程序提供了一个活动状态的管理器，它可以帮助你轻松地管理多个活动状态，并确保只有一个活动状态处于活动状态。
安装 shimney-knockout npm 包
使用 npm 命令行工具进行安装：
--- ------- ------ ----------------
引入 shimney-knockout
----- --------------- - -------------------------------------------- ----- -- - --------------------
创建一个活动状态实例
创建一个新的 ActivityManager 实例，这个实例将负责管理 Knockout.js 视图模型的活动状态。
----- --------------- - --- ------------------
创建一个活动状态
要创建一个新的活动状态，你需要提供状态的名称、状态的标题以及一个 Knockout.js 视图模型。一个活动状态被定义为一个简单的 JavaScript 对象：
----- -------- - -
----- ------------
------ ------------
---------- -
-- ----------- ---------------
-
--向 ActivityManager 添加活动状态
添加活动状态到 ActivityManager 实例。这个过程包括验证状态的名称是否存在，以及确保该名称只对应一个活动状态。如果名称没有问题，活动状态将被添加到 ActivityManager 中。你可以向 ActivityManager 添加任意数量的活动状态。
--------------------------------------
设置活动状态
选择要设置为活动状态的活动名称，然后调用 ActivityManager 的 setActive 方法。执行此操作后，所有其他活动状态都将被设置为非活动状态。
---------------------------------------
获取活动状态
要查找 ActivityManager 中的某个活动状态，你可以调用 ActivityManager 的 getActivity 方法，该方法将返回一个活动状态对象。
----- -------- - -----------------------------------------
在 HTML 中使用活动状态
你可以使用 data 绑定将活动状态直接绑定到 HTML 元素上。当活动状态被设置为活动状态时，该元素将获得 active CSS 类。
---- -------------------- ----------------------------
总结
shimney-knockout 是一个非常实用的 npm 包，可以帮助你更好地管理 Knockout.js 应用程序的活动状态。在使用这个包的时候，你需要提供状态的名称、状态的标题以及一个 Knockout.js 视图模型。你可以添加任意数量的活动状态，并使用 setActive 方法选择要设置为活动状态的活动名称。使用 data 绑定将活动状态直接绑定到 HTML 元素上，当活动状态被设置为活动状态时，该元素将获得 active CSS 类。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5f216f4f403f2923b035c6a8