当前位置:首页 > 前端教程

elementui分类

2026-03-05 20:37:05前端教程

组件分类

Element UI 的组件可以按照功能和使用场景分为以下几大类:

基础组件

  • Button 按钮
  • Link 文字链接
  • Layout 布局
  • Container 布局容器
  • Icon 图标
  • Divider 分割线

表单组件

  • Radio 单选框
  • Checkbox 多选框
  • Input 输入框
  • InputNumber 计数器
  • Select 选择器
  • Cascader 级联选择器
  • Switch 开关
  • Slider 滑块
  • TimePicker 时间选择器
  • DatePicker 日期选择器
  • DateTimePicker 日期时间选择器
  • Upload 上传
  • Rate 评分
  • ColorPicker 颜色选择器
  • Transfer 穿梭框
  • Form 表单

数据展示

  • Table 表格
  • Tag 标签
  • Progress 进度条
  • Tree 树形控件
  • Pagination 分页
  • Badge 标记
  • Avatar 头像
  • Skeleton 骨架屏
  • Empty 空状态
  • Descriptions 描述列表

导航组件

  • Menu 导航菜单
  • Tabs 标签页
  • Breadcrumb 面包屑
  • PageHeader 页头
  • Dropdown 下拉菜单
  • Steps 步骤条

反馈组件

  • Alert 警告
  • Loading 加载
  • Message 消息提示
  • MessageBox 弹框
  • Notification 通知
  • Dialog 对话框
  • Drawer 抽屉
  • Popover 弹出框
  • Tooltip 文字提示

其他组件

elementui分类

  • Card 卡片
  • Calendar 日历
  • Image 图片
  • Backtop 回到顶部
  • InfiniteScroll 无限滚动
  • Carousel 走马灯
  • Collapse 折叠面板
  • Timeline 时间线

按功能分类

布局类

  • Layout
  • Container
  • Grid

数据录入

  • 所有表单组件
  • Upload
  • ColorPicker

数据展示

  • Table
  • Tree
  • Tag
  • Avatar

导航类

elementui分类

  • Menu
  • Tabs
  • Breadcrumb

反馈类

  • Message
  • MessageBox
  • Notification

辅助类

  • Icon
  • Divider
  • Backtop

按使用频率分类

高频组件

  • Button
  • Input
  • Select
  • Table
  • Form
  • Dialog
  • Message

中频组件

  • Checkbox
  • Radio
  • Pagination
  • Menu
  • Tabs
  • Upload

低频组件

  • ColorPicker
  • Timeline
  • Skeleton
  • Calendar

这种分类方式可以帮助开发者快速找到需要的组件,并根据使用场景选择合适的UI元素。组件分类也反映了Element UI在设计时的模块化思路,每个类别都服务于特定的界面功能需求。

标签: elementui
分享给朋友:

相关文章

elementui优秀

elementui优秀

优秀特性 Element UI 作为一款基于 Vue.js 的组件库,因其设计规范、易用性和丰富的功能而广受开发者青睐。 一致性设计 遵循统一的视觉风格和交互逻辑,提供开箱即用的主题定制能力,支…

selectable elementui

selectable elementui

使 ElementUI 组件可选中 ElementUI 默认情况下没有直接提供 selectable 功能的组件,但可以通过以下方法实现可选中效果。 使用 el-checkbox 实现单个选中 通过…

elementui ico

elementui ico

ElementUI 图标使用指南 ElementUI 提供了一套内置的图标库,可以通过 el-icon- 前缀直接使用。这些图标基于字体图标(iconfont)实现,支持灵活的颜色、大小调整。 内置…

elementui字典

elementui字典

以下是关于 Element UI 字典功能的整理,结合常见使用场景和官方文档的实践方法: 字典数据绑定 Element UI 的 el-select 组件通常与字典数据结合使用。字典数据格式建议为…

elementui title

elementui title

ElementUI 的 Title 相关组件及用法 ElementUI 提供了多种与标题(Title)相关的组件和配置选项,适用于不同场景的需求。以下是常见的使用方法和组件介绍: 对话框(Di…

elementui progress

elementui progress

Element UI Progress 组件 Element UI 提供了一个 Progress 组件,用于展示操作的当前进度。该组件支持多种样式和配置选项,适用于文件上传、任务完成度等场景。 基…