2 Star 9 Fork 3

Chow cp SAMA / vue-iview-admin-template

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

Vue-cli-iview 轻量级后台管理系统基础模板

在线预览

相关依赖

功能

登录页

标签栏

  • 点击标签切换页面
  • 刷新当前标签页
  • 关闭其他标签/关闭所有标签

注意: 组件的名称和路由的名称一定要一致,例如 Home.vue 组件名称 name: home,则在路由文件中也要给它设置为 name: home,否则页面内容不能缓存

// 在router文件中
{
    path: 'home',
    name: 'home',
    component: () => import('../views/Home.vue')
}

// 在Home.vue中
export default {
    name: 'home'
}

侧边栏

  • 伸展/收缩
  • 页面宽度过小自动收缩
  • 多级菜单(利用iView组件)

用户相关

  • 消息通知
  • 用户头像
  • 基本资料

动态菜单栏

  • 根据数据动态生成菜单
  • 在菜单项上添加 hidden 属性可以隐藏该菜单项,但还是可以正常访问页面,具体请看 DEMO 及其相关代码

面包屑

  • 展示当前页面的路径

权限控制

  • 如果在未登陆的情况下访问指定页面 将会重定向到登陆页

eslint + vscode 自动格式化代码

具体配置方法请点击上面的链接,如果不需要 eslint,请将相关依赖卸载以及根目录下的 .eslintrc.js 删除。

jest 单元测试

如果不需要,请卸载相关依赖及删除根目录下的 tests 目录

页面标题 document.title

src/utils/index 下可设置默认的 title,在每个路由配置项上可设置对应的 title,具体示例请看代码

其它

  • 利用axios拦截器 实现了ajax请求前展示loading 请求结束关闭loading

注意

  • 源码可见 并且添加了必要的注释 可以自行更改

Index组件一般情况下只需要传数据就行 其他不用关注

市面上有大量的vue后台管理系统模板 但是功能都太丰富了 而且有很多组件用不上 所以写了这么一个最基础的 只有必要功能的模板 UI库使用的是iView 有大量的组件可用

开发

npm run serve

打包

npm run build

打包后的文件不能放在服务器根目录,否则会出现空白页面。

如果确实要把文件放在服务器根目录则需要更改打包的路径,打开 vue.config.js 文件,将如下代码删去即可。

publicPath: './',

License

MIT

MIT License Copyright (c) 2021 ZhouCPSAMA Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

vue-iview-admin-template 前后端分离轻量级后台模板 展开 收起
JavaScript 等 3 种语言
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/zcpsama/vue-iview-admin-template.git
git@gitee.com:zcpsama/vue-iview-admin-template.git
zcpsama
vue-iview-admin-template
vue-iview-admin-template
master

搜索帮助