随着前端工程化越来越流行，npm 包成为前端开发中不可或缺的一部分。很多常用的库和框架都可以通过 npm 安装，方便开发人员快速构建 Web 应用程序。其中 gths-manage 是一款非常便捷的 npm 包，可以帮助前端开发人员快速开发管理后台相关的页面。
在本篇文章中，我们将介绍 gths-manage 的基本使用方法和一些高级用法。
安装
要安装 gths-manage，只需执行以下命令:
npm install gths-manage --save
基本使用方法
使用 gths-manage，我们可以通过简单的代码快速创建管理后台页面。下面是一个简单的例子:
-- -------------------- ---- -------
--------- -----
------
------
------------------ ------------
----- ----------------
---- -- ----------- ----- ---
----- -------------------------------------------------------- -----------------
---- -- ------ ---
------- ------------------------------------------------------
---- -- ----------- - ---------- -- ---
------- ----------------------------------------------------------------
-------
------
---- ---------------------
---------- -----------------
------
---- --- ----------- ---
--------
---------------------------- -
--------------------------------
---
---------
-------
-------API
下面是一些 gths-manage 的 API 参考：
gthsManage(options)
初始化 gths-manage。options 对象可以包含以下属性:
sidebar: Boolean (default: true) 控制侧边栏是否出现。collapsed: Boolean (default: false) 控制侧边栏是否处于折叠状态。skin: String (default: 'blue') 控制皮肤颜色，此处可选 red, blue, green, 和 gray。search: Boolean (default: true) 控制搜索框是否出现。
.sidebar()
显示或隐藏侧边栏。
$('.gm-container').gthsManage('sidebar');.collapse()
折叠或展开侧边栏。
$('.gm-container').gthsManage('collapse');.skin(skin)
设置皮肤颜色，此处可选 red, blue, green, 和 gray。
$('.gm-container').gthsManage('skin', 'blue');.search(query)
搜索菜单栏项，根据 query 传入的值搜索。
$('.gm-container').gthsManage('search', 'dashboard');示例
我们可以通过以下代码快速创建一个后台管理页面:
-- -------------------- ---- -------
--------- -----
------
------
------------------ ------------
----- ----------------
---- -- ----------- ----- ---
----- -------------------------------------------------------- -----------------
---- -- ------ ---
------- ------------------------------------------------------
---- -- ----------- - ---------- -- ---
------- ----------------------------------------------------------------
-------
------
---- ---------------------
---- ------------------
----
----
-- -------- ---------------
-- --------- -------------------
----------------------
----
-----
----
-- ---------
-- --------- --------------
------------------
----
-----
----
-- ---------
-- --------- ------------
---------------------
----
-----
-----
------
----- ----------------
---- ----------------------
---------- -----------------
------
-------
------
---- --- ----------- ---
--------
---------------------------- -
-------------------------------
-------- -----
---------- ------
----- -------
------- ----
---
---
---------
-------
-------这段代码将创建一个带有三个菜单项的侧边栏，可以通过点击它们来切换主区域中的内容。
结论
gths-manage 是一个非常实用的 npm 包，可以帮助开发者快速创建一些基本的管理后台页面。本文给出了 gths-manage 的安装和基本使用方法，并且还介绍了一些 API 供读者参考和使用。随着前端工程化的不断发展，使用 npm 包将变得越来越常见，而 gths-manage 可以满足目前很多 Web 应用程序管理后台的需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056bdd81e8991b448e58ac