Timepicker 时间选择

优质
小牛编辑
122浏览
2023-12-01

时间选择组件。滚动选择交互,基于 Scrollpicker 实现。

Usage

全部引入

import { Timepicker } from 'beeshell';

按需引入

import Timepicker from 'beeshell/dist/components/Timepicker';

Examples

Timepicker 与 BottomModal 组合应用

image

Code

详细 Code

import { Timepicker } from 'beeshell';

<Timepicker
  style={{ paddingHorizontal: 50 }}
  proportion={[2, 1, 1]}
  hourStep={3}
  minuteStep={10}
  secondStep={10}
  value={null}
  onChange={(value) => {
    console.log(value)
  }}
/>

API

Props

NameTypeRequiredDefaultDescription
styleViewStylefalse{}样式
hourStepnumberfalse1时步长
minuteStepnumberfalse1分步长
secondStepnumberfalse1秒步长
valuestringfalsenull选定的时间字符串,'HH:mm:ss' 格式
onChangeFunctionfalsenull数据变化回调

组合使用 Scrollpicker 组件,透传 Scrollpicker 所有 Props