Skip to content

TimePicker 时间选择器

规则

js
{
    type: "TimePicker",
    field: "section_time",
    title: "活动时间",
    value: [],
    props: {
        isRange:true
    },
}
{
    type: "TimePicker",
    field: "section_time",
    title: "活动时间",
    value: [],
    props: {
        isRange:true
    },
}

参考:Element_TimePicker

value :Number | String

Props

参数说明类型可选值默认值
readonly完全只读booleanfalse
disabled禁用booleanfalse
editable文本框可输入booleantrue
clearable是否显示清除按钮booleantrue
size输入框尺寸stringmedium / small / mini
placeholder非范围选择时的占位内容string
startPlaceholder范围选择时开始日期的占位内容string
endPlaceholder范围选择时开始日期的占位内容string
isRange是否为时间范围选择,仅对<el-time-picker>有效booleanfalse
arrowControl是否使用箭头进行时间选择,仅对<el-time-picker>有效booleanfalse
align对齐方式stringleft / center / rightleft
popperClassTimePicker 下拉框的类名string
pickerOptions当前时间日期选择器特有的选项参考下表object{}
rangeSeparator选择范围时的分隔符string-'-'
valueFormat可选,仅TimePicker时可用,绑定值的格式。不指定则绑定值为 Date 对象string日期格式
defaultValue可选,选择器打开时默认显示的时间Date(TimePicker) / string(TimeSelect)可被new Date()解析(TimePicker) / 可选值(TimeSelect)
name原生属性string
prefixIcon自定义头部图标的类名stringel-icon-time
clearIcon自定义清空图标的类名stringel-icon-circle-close

Time Select Options

参数说明类型可选值默认值
start开始时间string09:00
end结束时间string18:00
step间隔时间string00:30
minTime最小时间,小于该时间的时间段将被禁用string00:00
maxTime最大时间,大于该时间的时间段将被禁用string

Time Picker Options

参数说明类型可选值默认值
selectableRange可选时间段,例如'18:30:00 - 20:30:00'或者传入数组['09:30:00 - 12:00:00', '14:30:00 - 18:30:00']string / array
format时间格式化(TimePicker)string小时:HH,分:mm,秒:ss,AM/PM A'HH:mm:ss'

Events

事件名说明参数
change用户确认选定的值时触发组件绑定值
blur当 input 失去焦点时触发组件实例
focus当 input 获得焦点时触发组件实例