Skip to content

TimePicker 时间选择器

规则

js
{
    type: "TimePicker",
    field: "section_time",
    title: "活动时间",
    value: ''
}

参考:arco-design_TimePicker

value :Number | String

Props

参数名描述类型默认值
type选择器类型'time' | 'time-range''time'
disabled是否禁用booleanfalse
allow-clear是否允许清除booleantrue
readonly是否为只读模式booleanfalse
error是否为错误状态booleanfalse
format展示日期的格式,参考字符串解析格式string'HH:mm:ss'
placeholder提示文案string-
size输入框尺寸'mini' | 'small' | 'medium' | 'large''medium'
popup-container弹出框的挂载容器string | HTMLElement-
use12-hours12 小时制booleanfalse
step设置 时 / 分 / 秒 的选择间隔{ hour?: number; minute?: number; second?: number;}-
disabled-hours禁用的部分小时选项() => number[]-
disabled-minutes禁用的部分分钟选项(selectedHour?: number) => number[]-
disabled-seconds禁用的部分秒数选项(selectedHour?: number, selectedMinute?: number) => number[]-
hide-disabled-options隐藏禁止选择的选项booleanfalse
disable-confirm禁用确认步骤,开启后直接点选时间不需要点击确认按钮booleanfalse
position弹出的位置'top' | 'tl' | 'tr' | 'bottom' | 'bl' | 'br''bl'
popup-visible控制弹出框打开或者关闭boolean-
default-popup-visible弹出框默认打开或者关闭booleanfalse
trigger-props可以传入 Trigger 组件的参数Record<string, unknown>-
unmount-on-close是否在关闭后销毁 dom 结构booleanfalse

Events

事件名描述参数
change组件值发生改变timeString: string | Array<string | undefined> | undefined time: date | Array<date | undefined> | undefined
select选择时间但未触发组件值变化timeString: string | Array<string | undefined> time: Date | Array<Date | undefined>
clear点击清除按钮-
popup-visible-change弹出框展开和收起visible: boolean

字符串解析格式

格式输出描述
YY21两位数的年份
YYYY2021四位数年份
M1-12月份,从 1 开始
MM01-12月份,两位数
MMMJan-Dec缩写的月份名称
MMMMJanuary-December完整的月份名称
D1-31月份里的一天
DD01-31月份里的一天,两位数
d0-6一周中的一天,星期天是 0
ddSu-Sa最简写的一周中一天的名称
dddSun-Sat简写的一周中一天的名称
ddddSunday-Saturday一周中一天的名称
H0-23小时
HH00-23小时,两位数
h1-12小时, 12 小时制
hh01-12小时, 12 小时制, 两位数
m0-59分钟
mm00-59分钟,两位数
s0-59
ss00-59秒,两位数
S0-9数百毫秒,一位数
SS00-99几十毫秒,两位数
SSS000-999毫秒,三位数字
Z-5:00UTC 的偏移量
ZZ-0500UTC 的偏移量,数字前面加上 0
AAM PM-
aam pm-
Do1st... 3st带序号的月份中的某天
X1410715640.579Unix 时间戳
x1410715640579Unix 毫秒时间戳

FormCreate 是一个开源项目,基于 MIT 许可证发布,欢迎个人和企业用户免费使用