ElementPlus 教程
ElementPlus Select 选择器
Select 选择器 当选项过多时,使用下拉菜单展示并选择内容。 基础用法 适用广泛的基础单选 v-model的值为当前被选中的el-option的 value 属性值 <t…
ElementPlus Select V2 虚拟列表选择器
Select V2 虚拟列表选择器 这个组件目前在测试当中,如果在使用中发现任何漏洞和问题,请在 Github 中提交 issue 以便我们进行处理 背景 在数…
ElementPlus Cascader 级联选择器
Cascader 级联选择器 当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 基础用法 有两种触发子菜单的方式 只需为 Cascader 的options属性指…
ElementPlus Switch 开关
Switch 开关 表示两种相互对立的状态间的切换,多用于触发「开/关」。 基本用法 绑定v-model到一个Boolean类型的变量。可以使用active-color属性与ina…
ElementPlus Slider 滑块
通过拖动滑块在一个固定区间内进行选择 基础用法 在拖动滑块时,显示当前值 通过设置绑定值自定义滑块的初始值 <template> <div class=”bloc…
ElementPlus TimePicker 时间选择器
TimePicker 时间选择器 用于选择或输入日期 任意时间点 可以选择任意时间 使用 el-time-picker 标签,通过 disabledHours …
ElementPlus TimeSelect 时间选择
TimeSelect 时间选择 用于选择或输入日期 固定时间点 提供几个固定的时间点供用户选择 使用 el-time-select 标签,分别通过start、end和step指定可…
ElementPlus DatePicker 日期选择器
DatePicker 日期选择器 用于选择或输入日期 选择日 以「日」为基本单位,基础的日期选择控件 基本单位由type属性指定。通过shortcuts配置快捷选项,禁用日期通过&…
ElementPlus DateTimePicker 日期时间选择器
在同一个选择器里选择日期和时间 DateTimePicker 由 DatePicker 和 TimePicker 派生,相关属性可以参照 DatePicker 和 TimePick…
ElementPlus Upload 上传
Upload 上传 通过点击或者拖拽上传文件 点击上传 只能上传 jpg/png 文件,且不超过 500kb food.jpeg food2.jpeg 通过 slot 你可以传入自…
ElementPlus Rate 评分
评分组件 基础用法 默认不区分颜色 区分颜色 评分默认被分为三个等级,可以利用颜色数组对分数及情感倾向进行分级(默认情况下不区分颜色)。三个等级所对应的颜色用colors属性设置,…
ElementPlus ColorPicker 颜色选择器
ColorPicker 颜色选择器 用于颜色选择,支持多种格式。 基础用法 有默认值 无默认值 使用 v-model 与 Vue 实例中的一个变量进行双向绑定,绑定的变量需要是字符…
ElementPlus Transfer 穿梭框
Transfer 穿梭框 基础用法 Transfer 的数据通过 data 属性传入。数据需要是一个对象数组,每个对象有以下属性:key 为数据的唯一…
ElementPlus Form 表单
Form 表单 由输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据组件升级采用了 flex 布局,以替代旧版本的 float 布局。 典型表单 包括各种表单项,比…
ElementPlus Table 表格
Table 表格 用于展示多条结构类似的数据,可对数据进行排序、筛选、对比或其他自定义操作。 基础表格 基础的表格展示用法。 当 el-table 元素中注入&…
ElementPlus Tag 标签
Tag 标签 用于标记和选择。 基础用法 由type属性来选择 tag 的类型,也可以通过color属性来自定义背景色。 <template> <el-tag&g…
ElementPlus Progress 进度条
Progress 进度条 用于展示操作进度,告知用户当前状态和预期。 线形进度条 Progress 组件设置percentage属性即可,表示进度条对应的百分比,必填,必须在 0-…
ElementPlus Tree 树形控件
Tree 树形控件 用清晰的层级结构展示信息,可展开或折叠。 基础用法 基础的树形结构展示。 <template> <el-tree :data=”data” :…
ElementPlus Pagination 分页
Pagination 分页 当数据量过多时,使用分页分解数据。 基础用法 页数较少时的效果 设置layout,表示需要显示的内容,用逗号分隔,布局元素会依次显示。prev表示上一页…
ElementPlus Badge 标记
Badge 标记 出现在按钮、图标旁的数字或状态标记。 基础用法 展示新消息数量。 定义value属性,它接受Number或者String。 …