时间选择器

vx-time-picker 组件用于选择时间。

目录：

• Props
• Events
• 值类型
• 时间格式化 format
• 配合 timePickerProps 控制
• 各种状态
• 需要确认的时间选择器
• blur 事件示例

Props

公共props

该组件继承了 vx-field的props，所以是通用的，以下仅罗列 vx-time-picker 特有的Props

Name	Introduction	Type	Default Value
format	见时间格式化	String	'HH:mm:ss'
clearable	显示可清除样式	Boolean	false

vx-time-picker props

Name	Introduction	Type	Default Value
placeholder	占位文本	String	-
timePickerProps	时间选择组件的配置参数	Object	-
modelValue	绑定的值，见值类型	String Number	-
hideAppendInner	隐藏内部的附加图标	Boolean	false
needConfirm	是否需要确认按钮	Boolean	false

Events

Name	Payload	Introduction
blur	string	某些情况如果期望失焦或者关闭了下拉后获取值时用这个事件，查看blur 事件示例
click:confirm	object	当点击确认按钮时触发

值类型

• 组件可以接受字符串或数字类型的时间值，最终会根据设定的format格式化输出

时间格式化 format

• 默认格式是 HH:mm:ss
• 可以自定义格式，如 HH:mm
• format 不仅影响展示也影响组件的可选项，例如使用 HH:mm 格式时，秒选择器将不会显示

配合 timePickerProps 控制

可以通过 timePickerProps 控制时间选择器的行为。

注意：禁用（disableXXX）和隐藏（hideXXX）是两种不同的状态：

• 禁用（disableXXX）：时间单位依然可见，但不可选择（显示为灰色）
• 隐藏（hideXXX）：时间单位完全不显示

各种状态

需要确认的时间选择器

使用 needConfirm 属性可以添加确认按钮，只有点击确认后才会更新值。

blur 事件示例

blur 事件在组件失焦或关闭下拉菜单时触发，可用于获取当前值或执行其他操作。