福利来了：vaw-layouts，来不及解释了，赶紧上车
福利来了：vaw-layouts，来不及解释了，赶紧上车
用户9078190
发布于 2022-10-25 21:30:11
发布于 2022-10-25 21:30:11
代码可运行
运行总次数：0
代码可运行
继vue-admin-work开源框架开发完之后，请多小伙伴问我，要怎么样快速搭建公司的后台管理系统。目前的解决方案是在 vue-admin-work的基础上进行删除无用的代码或者修改自己的需求。当了解了这一需求之后，我们想了一下也确实不方便，所以为了解决这一痛点 vaw-layouts项目就正式诞生了。
vaw-layouts 把一个后台管理系统的骨架和一些基本的业务逻辑抽离出来，当需要使用的时候直接在项目中引入然后再简单配置一下就可以了。
不过有一点需要注意的是：vaw-layouts项目内部还是使用的 vue2.x和 vue-router3.x、 element-ui作为支撑。所以想要使用这个项目的小伙伴，就得再提前引入使用这两个项目了。
项目目录结构
.
├── README.md
├── babel.config.js
├── package-lock.json
├── package.json
├── public
│ ├── favicon.ico
│ └── index.html
└── src
├── App.vue
├── assets
│ ├── iconfont
│ ├── logo.png
│ ├── qrcode.jpg
│ ├── styles
│ └── work_logo.png
├── components
│ ├── Layout.vue
│ ├── Main.vue
│ ├── MainLayout.vue
│ ├── RouterViewLayout.vue
│ ├── actions
│ ├── avatar
│ ├── breadcrumb
│ ├── footer
│ ├── header
│ ├── humburger
│ ├── index.js
│ ├── logo
│ ├── message
│ ├── navbar
│ ├── setting
│ ├── sidebar
│ ├── svg-icon
│ └── tabbar
├── main.js
├── router
│ └── index.js
├── store
│ ├── index.js
│ └── modules
├── utils
│ └── index.js
└── views
├── index
├── mall
└── redirect主体功能
整体的布局
- 左右结构
- 上下结构
- 分栏结构
- 同时要支持手机，平板，电脑的响应式结构
多种主题
- 明亮主题
- 暗黑主题
- 蓝色菜单主题
- 黑色菜单主题
主题颜色
- 蓝
- 红
- 青
- 紫
侧边栏
- 普通样式
- 分栏样式
- 支持无限子级
顶部栏（导航栏和状态栏）
- 面包屑
- 动作按钮
- 用户状态
- 标签栏
主要内容区域（平时我们开发的页面主要显示区域）
快速开始
// 克隆代码
git clone https://github.com/qingqingxuan/vaw-layouts.git
// 进入目录
cd vaw-layouts
// 启动项目
npm run serve体验地址
https://qingqingxuan.github.io/vaw-layouts/index.html
本文参与 腾讯云自媒体同步曝光计划，分享自微信公众号。
原始发表：2021-06-03，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
