# xa-time-picker

> 时间选择组件,使用方式与 ANTD 一致:

Latest version **0.0.1** (published 2018-11-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install xa-time-picker
pnpm add xa-time-picker
yarn add xa-time-picker
bun add xa-time-picker
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2018-11-05 |
| First published | 2018-11-05 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 16 |
| Unpacked size | 13.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | hengg |

## Links

- npm: https://www.npmjs.com/package/xa-time-picker
- npm.io page: https://npm.io/package/xa-time-picker

## Dependencies (16)

- [react](https://npm.io/package/react.md) ^16.2.0
- [moment](https://npm.io/package/moment.md) ^2.22.2
- [webpack](https://npm.io/package/webpack.md) ^4.20.2
- [xa-icon](https://npm.io/package/xa-icon.md) ^1.0.8
- [react-dom](https://npm.io/package/react-dom.md) ^16.5.2
- [css-loader](https://npm.io/package/css-loader.md) ^0.28.9
- [prop-types](https://npm.io/package/prop-types.md) ^15.6.2
- [@babel/core](https://npm.io/package/@babel/core.md) ^7.1.0
- [webpack-cli](https://npm.io/package/webpack-cli.md) ^3.1.2
- [babel-loader](https://npm.io/package/babel-loader.md) ^8.0.2
- [style-loader](https://npm.io/package/style-loader.md) ^0.19.1
- [rc-time-picker](https://npm.io/package/rc-time-picker.md) ^3.4.0
- [@babel/preset-env](https://npm.io/package/@babel/preset-env.md) ^7.1.0
- [@babel/preset-react](https://npm.io/package/@babel/preset-react.md) ^7.0.0
- [webpack-node-externals](https://npm.io/package/webpack-node-externals.md) ^1.6.0
- [@babel/plugin-transform-object-assign](https://npm.io/package/@babel/plugin-transform-object-assign.md) ^7.0.0

## Recent versions

- 0.0.1 (latest) — 2018-11-05
- 0.0.0 — 2018-11-05

## README

# xa-time-picker

时间选择组件,使用方式与 ANTD 一致:

```jsx
 //受控组件: 
<TimePicker value={this.state.value} onChange={this.onChange} defaultOpenValue={moment('12:24:48', 'HH:mm:ss')} /> 
 //禁用组件: 
<TimePicker defaultValue={moment('12:08:23', 'HH:mm:ss')} disabled />         
 //选择时分: 
<TimePicker defaultValue={moment('12:08', 'HH:mm')} format={'HH:mm'} />         
 //选择步长: 
<TimePicker minuteStep={15} secondStep={10} />         
 //附加组件: 
<TimePicker open={this.state.open}
    onOpenChange={this.handleOpenChange}
    addon={() => (<button onClick={this.handleClose}>关闭</button>)}
    />
 //十二小时: 
<TimePicker use12Hours />
//禁用部分时分秒:
<TimePicker disabledHours={() => [0, 1, 2, 3]}
    disabledMinutes={(selectedHour) => selectedHour === 4 ? [0, 1, 2, 3] : []}
    />
```

| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| format | 展示的时间格式 | string | "HH:mm:ss" |
| value | 选中的时间 | moment| 无 |
| defaultValue | 默认时间 | moment | 无 |
| defaultOpenValue | 面板打开时默认选中的值 | moment | moment() |
| disabled | 禁用全部操作 | boolean | false |
| disabledHours | 禁止选择部分小时选项 | `()=>[]` | 无 |
| disabledMinutes | 禁止选择部分分钟选项 | `(selectedHour)=>[]` | 无 |
| disabledSeconds | 禁止选择部分秒选项 | `(selectedHour, selectedMinute)=>[]` | 无 |
| hideDisabledOptions | 隐藏禁止选择的选项 | boolean | false |
| open | 面板是否打开 | boolean | false |
| placeholder | 没有值的时候显示的内容 | string | "请选择时间" |
| use12Hours | 使用 12 小时制，为 true 时 `format` 默认为 `h:mm:ss a` | boolean | false |
| onChange | 时间发生变化的回调 | `(time, timeString)=>{}` | 无 |
| onOpenChange | 面板打开/关闭时的回调 |  `(isOpen)=>{}`  | 无 |
| addon | 选择框底部显示自定义的内容 | `ReactElement` | 无 |

---
_Source: https://npm.io/package/xa-time-picker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._