UI组件库
概述
组件库基于element-ui进行了封装,可以替代element-ui组件库。
提供了丰富的组件,包括基础通用组件、地图组件、可视化组件,在封装基础通用组件过程中对element组件样式进行了改写提供了一套默认样式,对通用组件增加了属性和功能并新增了组件。
已封装组件
- Button
- Input
- Radio
- Checkbox
- Switch
- Select
- Cascader
- Pagination
- SimplePagination
- Sidebar
- TimePicker
- Dialog
- Tag
- Steps
- Slider
- Tabs
- Message
- Popover
- FeedbackDialog
- MessageBox
- CitySelect
- PlaceEditor
- MultipleLine
- GeneralBar
- RatioPie
- RatioBar
使用
安装依赖
项目中引用
增加的属性和功能
Cascader组件
优化了任意选择子节点的样式,将原有的需要点击单选框按钮选中,改为了去掉单选按钮并点击本行选项就能选中
Dialog组件
参数 | 说明 | 类型 | 可选值 | 默认值 |
title-icon | 头部title图标,取值success、warn、error | string | — | — |
Tag组件
参数 | 说明 | 类型 | 可选值 | 默认值 |
disabled | 是否禁用状态 | boolean | ---- | false |
background | 背景色 | string | ---- | ---- |
Popover组件
参数 | 说明 | 类型 | 可选值 | 默认值 |
icon | 标题字体图标 | String | — | — |
参数 | 说明 | 类型 | 可选值 | 默认值 |
square | 是否方形按钮 | boolean | — | false |
ghost | 幽灵属性,使按钮背景透明 | boolean | — | false |
参数 | 说明 | 类型 | 可选值 | 默认值 |
status | 类型 | string | primary / success / warning / danger | — |
Radio组件
参数 | 说明 | 类型 | 可选值 | 默认值 |
type | 类型 | string | primary / success / warning / danger | — |
Checkbox组件
参数 | 说明 | 类型 | 可选值 | 默认值 |
type | 类型 | string | primary / success / warning / danger | — |
Switch组件
参数 | 说明 | 类型 | 可选值 | 默认值 |
type | 类型 | string | primary / success / warning / danger | — |
新增组件
- SimplePagination 简单分页组件
- Sidebar 侧边栏组件
- FeedbackDialog 反馈组件
- CitySelect 城市选择器
- PlaceEditor 地点编辑器组件
- MultipleLine 图表组件
- GeneralBar 图表组件
- RatioPie 比例饼图组件
- RatioBar 比例柱状图