# vue-admin-app

**Repository Path**: wangguisong/vue-admin-app

## Basic Information

- **Project Name**: vue-admin-app
- **Description**: 将vue-element-admin中的布局Layout以npm包的形式提供出来，方便系统引入使用，同时保证自身项目代码的简洁。
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-10-21
- **Last Updated**: 2022-10-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: vue-element-admin, vue-admin-template

## README

# vue-admin-app
本项目将[vue-element-admin](https://github.com/PanJiaChen/vue-element-admin)中的布局Layout以npm包的形式提供出来，方便系统引入使用，同时保证自身项目代码的简洁。
## 安装
***需提前安装vue2.x、element-ui、vue-router、vuex***
```bash
npm install vue-admin-app
```
## 使用
```js
import Vue from 'vue'
import ElementUI from 'element-ui'
import store from './store'
import router from './router'
import VApp from 'vue-admin-app' // 引入依赖
import 'vue-admin-app/dist/index.css' // 引入样式，已集成了element-ui的theme-chalk样式，无需再引入element-ui的样式文件

Vue.use(ElementUI)
Vue.use(VApp) // 使用插件

// 使用new VApp()代替new Vue(), title、router、store参数为必填，完整参数见下方“配置参数”
new VApp({
  router, // vue-router实例
  store, // vuex实例
  title: '系统名称'
})

```

## 配置参数
| 参数名      | 类型                | 说明                                                                                       |
| ----------- | ------------------- | ------------------------------------------------------------------------------------------ |
| el          | string              | 挂载点的selector,默认是`#app`                                                              |
| title       | string              | `必填`，系统名称                                                                           |
| logo        | string              | 系统logo的图片绝对地址,例如`"/logo.png"`,会在sidebarLogo参数为true的情况下在侧边栏展示logo |
| tagsView    | boolean             | 是否显示标签栏导航,默认true                                                                |
| fixedHeader | boolean             | 是否固定网站头，默认false                                                                  |
| sidebarLogo | boolean             | 是否在侧边栏展示logo,默认false                                                             |
| header      | object [definition] | 传入一个vue组件, 用于自定义网站头上的内容                                                  |
| router      | VueRouterInstance   | `必填`, vue-router的实例，会根据其中的路由配置展示菜单                                     |
| store       | VuexInstance        | `必填`，vuex实例，会在里面注入app、settings、tagsView模块用于控制布局                      |


## 其他
* 未集成权限功能，不能使用路由配置中的roles控制权限，权限功能可通过在创建vue-router实例前对路由配置进行过滤实现
## 相关链接
- [vue-element-admin在线预览](https://panjiachen.gitee.io/vue-element-admin/)
- [vue-element-admin文档](https://panjiachen.gitee.io/vue-element-admin-site/zh/)
## 源码
[gitee](https://gitee.com/wangguisong/vue-admin-app)
## License

[MIT](https://gitee.com/wangguisong/vue-admin-app/blob/master/LICENSE)