简介
vue-management 是一个基于 Vue.js 框架的管理后台模板。该模板使用了 Element UI 组件库，提供了丰富的基础组件和布局以支撑快速开发管理后台界面。此外，该模板已经将一些实用的插件和组件整合在一起，以方便开发者快速构建管理后台。
安装
安装 vue-management 的方法很简单，我们只需要在终端中运行以下命令即可：
npm install vue-management
使用
安装完成后，在项目入口处引入 vue-management：
import Vue from 'vue' import VueManagement from 'vue-management' Vue.use(VueManagement)
运行以上代码后，即可在你的项目中使用 vue-management 提供的组件和插件。
组件
布局
vue-management 提供了多种布局方式，开发者可以灵活地选择合适的布局方式：
ManagementLayout：管理后台主页面布局BlankLayout：空白布局DefaultLayout：默认布局
导航
vue-management 提供了一套基于路由的导航菜单组件：ManagementNav。
在 ManagementNav 中，可以通过 data 属性设置菜单项：
<management-nav :data="menu"/>
menu 可以是一个数组，数组的每个元素包含以下属性：
text：菜单项文本icon：菜单项图标path：路由地址children：菜单项的子菜单，格式与menu相同
表格
vue-management 提供了一套基于 Element UI 表格组件的增强版表格组件：ManagementTable。
ManagementTable 支持以下增强功能：
- 集成分页组件
- 支持搜索
- 支持导出数据
表单
vue-management 提供了一系列基于 Element UI 表单组件的增强版表单组件。
其中，ManagementForm 是一个高度可扩展的表单组件，支持自定义各种表单字段类型和组件，包括：
- 布尔值字段
- 单选框和复选框
- 数字输入框
- 下拉框和多选框
对话框
vue-management 提供了一套基于 Element UI 对话框组件的增强版对话框组件：ManagementDialog。
ManagementDialog 支持以下增强功能：
- 支持根据配置自动生成表单
- 支持打开对话框并加载数据
- 支持根据表单验证结果自动关闭对话框
示例代码
下面是一个使用 vue-management 开发的管理后台界面的示例代码：
-- -------------------- ---- -------
----------
-------------------
--------------- -----------------
---------
------------ --
----------
--------------------
-----------
--------
------ ---------------- ---- -------------------------------------------------------
------ ------------- ---- -------------------------------------------------
------ - ---------- - ---- ------
------ ------- -
----------- -
-----------------
-------------
--
---- -- -
------ -
-------- -
-
----- ------
----- ---------------
----- ----
--------- ----
--
-
----- -------
----- ------------------
----- ----------
--------- ----
--
-
----- -------
----- -------------------
----- ---------
--------- ----
-
-
-
--
--------- -
---------------
------------
--
-
-
---------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562b781e8991b448dff60