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

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表头

ElementUI 表头自定义方法 修改表头样式 通过 header-cell-class-name 属性为表头单元格添加自定义类名,配合 CSS 实现样式修改。例如更改背景色和字体: .el-ta…

elementui重写

elementui重写

重写 Element UI 组件的方法 Element UI 是一个基于 Vue.js 的组件库,重写其组件可以通过以下几种方式实现,具体取决于需求场景。 全局样式覆盖 通过修改 CSS 变量或覆盖…

elementui重构

elementui重构

Element UI 重构指南 Element UI 是一款基于 Vue.js 的组件库,重构通常涉及版本升级、性能优化或代码结构调整。以下是常见的重构方法和注意事项: 升级至 Element Pl…

elementui案例

elementui案例

Element UI 案例 Element UI 是一个基于 Vue.js 的组件库,广泛用于构建企业级中后台前端界面。以下是一些常见的 Element UI 案例和使用场景: 表单设计 Eleme…

elementui datepick

elementui datepick

ElementUI DatePicker 使用指南 ElementUI 是一套基于 Vue.js 的组件库,DatePicker 是其中一个常用的日期选择组件。以下是关于 ElementUI Date…

elementui dropdown

elementui dropdown

ElementUI Dropdown 基础用法 ElementUI 的 Dropdown 组件用于创建下拉菜单,常用于导航或操作选项的折叠展示。以下是一个基础示例: <el-dropdown&…