组件
Vue Business Kit 提供了一套基于 Element Plus、ECharts 和自定义原生组件的丰富 UI 组件,开箱即用。
关于文档
本项目对 Element Plus 官方文档进行引用,以便更方便地参考和使用。
标识说明
@\* 表示需要使用某属性才能使用的功能,例如:@columns 表示需要使用 columns 属性才能使用的功能
extended 表示该属性基于原组件的原生属性功能进行了扩展
required 表示该属性为必选属性,使用时必须配置。
特性
- 🎨 Element Plus 集成 - 包含所有 Element Plus 组件并对部分组件进行增强
- 📊 原生组件 - 组件库独立开发的基础组件
- 📝 类型支持 - 完整的 TypeScript 类型定义
使用方式
vue
<template>
<bk-button icon="tabler:mood-tongue-wink-2">按钮</bk-button>
<bk-icon icon="tabler:mood-tongue-wink-2" />
</template>组件总览
Basic 基础组件
- Button 按钮
- Border 边框
- Color 颜色
- Container 布局容器
- Icon 图标
- Layout 布局
- Link 链接
- Text 文本
- Scrollbar 滚动条
- Space 间距
- Typography 排版
Configuration 配置组件
Form 表单组件
- Autocomplete 自动补全输入框
- Cascader 级联选择器
- Checkbox 多选框
- Color Picker 颜色选择器
- Date Picker 日期选择器
- DateTime Picker 日期时间选择器
- Form 表单组件
- Input 输入框
- Input Number 数字输入框
- Input Tag 标签输入框
- Mention 提及
- Radio 单选框
- Rate 评分
- Select 选择器
- Virtualized Select 虚拟滚动选择器
- Slider 滑块
- Switch 开关
- Time Picker 时间选择器
- Time Select 时间选择器
- Transfer 穿梭框
- Tree Select 树形选择器
- Upload 上传器
Data 数据展示
- Avatar 头像
- Badge 标记
- Calendar 日历
- Card 卡片
- Carousel 走马灯
- Collapse 折叠面板
- Descriptions 描述列表
- Empty 空状态
- Image 图片
- Infinite Scroll 无限滚动
- Pagination 分页
- Progress 进度条
- Result 结果
- Skeleton 骨架屏
- Table 表格
- Tag 标签
- Timeline 时间轴
- Tour 漫游式引导
- Tree 树形控件
- Statistic 统计数值
- Segmented 分段器
Navigation 导航
Feedback 反馈组件
- Alert 提示
- Dialog 对话框
- Drawer 抽屉
- Loading 加载
- Message 消息提示
- Message Box 消息提示
- Notification 通知
- Popconfirm 气泡确认框
- Popover 气泡卡片
- Tooltip 文字提示