vue antd 中后台前端框架vue-alain 二
2018-10-20 本文已影响34人
诸葛_小亮
vue-alain
vue-alain 是基于 vue 和 Ant Design of Vue(Ant Design 的 vue 版本) 基础组件库的中后台前端,使用vue
vue cli 3.0
typescript
antd
antd pro
Ant Design Vue
技术栈,参考并使用了ng-alain
相关内容,秉承 Ant Design 的设计价值观。
github--https://github.com/vue-alain/vue-alain
预览:https://vue-alain.github.io/
vue antd 中后台前端框架vue-alain
更新内容
- 新增 reusetab 组件
- 使用 v-charts 重构图表组件,包括 miniarea 、minibar、timeline 等
- 修复菜单收起显示不正常的问题
- 完善多语言信息
- 实现登录功能
组件
- charts组件,基于v-charts封装了部分常用组件
- reusetab组件,复用tab组件,用于tab导航
- breadcrumblist组件,路由导航组件
- selectlange, 多语言切换组件
charts
封装了一些常用组件,比如miniarea、minibar、pie 等
miniarea
![](https://img.haomeiwen.com/i1397128/c7ca174e91381fef.png)
![](https://img.haomeiwen.com/i1397128/0d84f85c23a29f76.png)
minibar
![](https://img.haomeiwen.com/i1397128/a3aa35cb1c990949.png)
bar
![](https://img.haomeiwen.com/i1397128/205d7e6ea81eacc1.png)
pie
![](https://img.haomeiwen.com/i1397128/8baabd74debc984d.png)
![](https://img.haomeiwen.com/i1397128/3182c5439065769a.png)
timeline
![](https://img.haomeiwen.com/i1397128/543e14e7addd0c5c.png)
reusetab
复用tab标签,主要使用在复用路由上,展示路由信息,以便快捷跳转到打开过的页面
![](https://img.haomeiwen.com/i1397128/2858a37cbb965bf5.png)
breadcrumblist
面包屑快捷导航组件,根据当前路由信息,设置面包学的导航信息
![](https://img.haomeiwen.com/i1397128/984bd40f63a26df3.png)
selectlange
切换多语言组件,依赖v-i18n组件
![](https://img.haomeiwen.com/i1397128/e0ae63953f99a5b2.png)
![](https://img.haomeiwen.com/i1397128/9a9b8a692b08f2be.jpg)