TimeSelect 时间选择

用于选择或输入日期

可用时间范围是 00:00-23:59

固定时间点

提供几个固定的时间点供用户选择

使用 el-time-select 标签,然后通过startendstep指定起始时间,结束时间和步长。

Select time

时间格式

使用 format 属性来控制时间格式 (小时以及分钟)。

这里 查看 Day.js 支持的 format 参数。

WARNING

请一定要注意传入参数的大小写是否正确

Select time

固定时间范围

如果先选中了开始(或结束)时间,则结束(或开始)时间的状态也将会随之改变。

Start time
End time

API

Attributes

属性名说明类型默认值
model-value / v-model选中项绑定值string
disabled禁用状态booleanfalse
editable文本框可输入booleantrue
clearable是否显示清除按钮booleantrue
size输入框尺寸enumdefault
placeholder非范围选择时的占位内容string
name原生属性string
effectTooltip 主题,内置了 dark / light 两种主题string / enumlight
prefix-icon自定义前缀图标string / ComponentClock
clear-icon自定义清除图标string / ComponentCircleClose
start开始时间string09:00
end结束时间string18:00
step间隔时间string00:30
min-time最早时间点,早于该时间的时间段将被禁用string
max-time最晚时间点,晚于该时间的时间段将被禁用string
format设置时间格式string see formatsHH:mm
empty-values 2.7.0组件的空值配置 参考config-providerarray
value-on-clear 2.7.0清空选项的值 参考 config-providerstring / number / boolean / Function

Events

事件名说明类型
change用户确认选定的值时触发Function
blur在组件 Input 失去焦点时触发Function
focus在组件 Input 获得焦点时触发Function
clear 2.7.7可清空的单选模式下用户点击清空按钮时触发Function

Exposes

方法名说明类型
focus使 input 获取焦点Function
blur使 input 失去焦点Function

源代码

组件样式文档

贡献者