1# TimePicker 2 3选择时间的滑动选择器组件。 4 5> **说明:** 6> 7> 该组件从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 8 9 10## 权限列表 11 12无 13 14 15## 子组件 16 17无 18 19 20## 接口 21 22TimePicker(options?: {selected?: Date}) 23 24默认以00: 00至23: 59的时间区间创建滑动选择器。 25 26**参数:** 27 28| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | 29| -------- | ---- | ---- | ------ | --------- | 30| selected | Date | 否 | 当前系统时间 | 设置选中项的时间。 | 31 32## 属性 33 34| 名称 | 参数类型 | 默认值 | 描述 | 35| --------------- | ------- | ----- | --------------------- | 36| useMilitaryTime | boolean | false | 展示时间是否为24小时制,不支持动态修改。 | 37 38 39## 事件 40 41| 名称 | 功能描述 | 42| ---------------------------------------- | ----------- | 43| onChange(callback: (value: TimePickerResult ) => void) | 选择时间时触发该事件。 | 44 45## TimePickerResult对象说明 46| 名称 | 参数类型 | 描述 | 47| ------ | ------ | ------- | 48| hour | number | 选中时间的时。 | 49| minute | number | 选中时间的分。 | 50 51 52## 示例 53 54 55### 时间选择器 56 57```ts 58// xxx.ets 59@Entry 60@Component 61struct TimePickerExample { 62 private selectedTime: Date = new Date('7/22/2022 8:00:00') 63 64 build() { 65 Column() { 66 TimePicker({ 67 selected: this.selectedTime, 68 }) 69 .useMilitaryTime(true) 70 .onChange((date: TimePickerResult) => { 71 console.info('select current date is: ' + JSON.stringify(date)) 72 }) 73 }.width('100%') 74 } 75} 76``` 77 78![zh-cn_image_0000001251292933](figures/zh-cn_image_0000001251292933.gif) 79