TimeSelect 时间选择
用于选择或输入日期
可用时间范围是 00:00-23:59
固定时间点
提供几个固定的时间点供用户选择
使用 el-time-select
标签,然后通过start
、end
和step
指定起始时间,结束时间和步长。
时间格式
使用 format
属性来控制时间格式 (小时以及分钟)。
在 这里 查看 Day.js 支持的 format 参数。
WARNING
请一定要注意传入参数的大小写是否正确
固定时间范围
如果先选中了开始(或结束)时间,则结束(或开始)时间的状态也将会随之改变。
API
Attributes
属性名 | 说明 | 类型 | 默认值 |
---|---|---|---|
model-value / v-model | 选中项绑定值 | string | — |
disabled | 禁用状态 | boolean | false |
editable | 文本框可输入 | boolean | true |
clearable | 是否显示清除按钮 | boolean | true |
size | 输入框尺寸 | enum | default |
placeholder | 非范围选择时的占位内容 | string | — |
name | 原生属性 | string | — |
effect | Tooltip 主题,内置了 dark / light 两种主题 | string / enum | light |
prefix-icon | 自定义前缀图标 | string / Component | Clock |
clear-icon | 自定义清除图标 | string / Component | CircleClose |
start | 开始时间 | string | 09:00 |
end | 结束时间 | string | 18:00 |
step | 间隔时间 | string | 00:30 |
min-time | 最早时间点,早于该时间的时间段将被禁用 | string | — |
max-time | 最晚时间点,晚于该时间的时间段将被禁用 | string | — |
format | 设置时间格式 | string see formats | HH:mm |
empty-values 2.7.0 | 组件的空值配置 参考config-provider | array | — |
value-on-clear 2.7.0 | 清空选项的值 参考 config-provider | string / number / boolean / Function | — |
Events
事件名 | 说明 | 类型 |
---|---|---|
change | 用户确认选定的值时触发 | Function |
blur | 在组件 Input 失去焦点时触发 | Function |
focus | 在组件 Input 获得焦点时触发 | Function |
clear 2.7.7 | 可清空的单选模式下用户点击清空按钮时触发 | Function |
Exposes
方法名 | 说明 | 类型 |
---|---|---|
focus | 使 input 获取焦点 | Function |
blur | 使 input 失去焦点 | Function |