# bee-timepicker
> Timepicker ui component for react
Latest version **2.0.14** (published 2020-04-24) · MIT license · 139 weekly downloads
## Install
```sh
npm install bee-timepicker
pnpm add bee-timepicker
yarn add bee-timepicker
bun add bee-timepicker
```
## Health
**Score 15/100 (F)** — status: abandoned.
Positive: no vulnerabilities.
Warnings: low downloads; no types; no esm support.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 2.0.14 |
| Published | 2020-04-24 |
| First published | 2017-06-15 |
| Weekly downloads | 139 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=4.0.0 |
| Dependencies | 3 |
| Unpacked size | 106 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Yonyou FED |
| Maintainers | banyudu, bjyxszd, guoyongfeng, huayingjie, jonyw, kvkens, liushaozhen, liuyk, npm_yx, tinper-bot, whizbz, yangchch, yonyoufed, zhaoyuchief |
| Keywords | react, react-component, bee-timepicker, iuap-design, tinper-bee, Timepicker |
## Links
- npm: https://www.npmjs.com/package/bee-timepicker
- Repository: https://github.com/tinper-bee/bee-timepicker
- Homepage: https://github.com/tinper-bee/bee-timepicker.git
- Issues: https://github.com/tinper-bee/bee-timepicker.git/issues
- npm.io page: https://npm.io/package/bee-timepicker
## Dependencies (3)
- [rc-trigger](https://npm.io/package/rc-trigger.md) ^2.6.2
- [babel-runtime](https://npm.io/package/babel-runtime.md) ^6.23.0
- [tinper-bee-core](https://npm.io/package/tinper-bee-core.md) latest
## Alternatives
- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads
## Recent versions
- 2.0.14 (latest) — 2020-04-24
- 2.0.13-alpha.0 (alpha) — 2020-04-01
- 2.0.13 — 2020-04-01
- 2.0.12 — 2020-01-09
- 2.0.11 — 2019-11-27
- 2.0.10 — 2019-11-25
- 2.0.9 — 2019-11-25
- 2.0.8 — 2019-11-14
- 2.0.7 — 2019-10-29
- 2.0.6 — 2019-10-28
- 2.0.5 — 2019-09-04
- 2.0.5-alpha.0 — 2019-09-04
- 2.0.4 — 2019-05-30
- 2.0.3 — 2019-04-24
- 2.0.2 — 2019-03-19
- … 11 more at https://npm.io/package/bee-timepicker/versions
## README
# bee-timepicker
[](https://www.npmjs.com/package/bee-timepicker)
[](https://travis-ci.org/tinper-bee/bee-timepicker)
[](https://coveralls.io/github/tinper-bee/bee-timepicker?branch=master)
[](https://david-dm.org/tinper-bee/bee-timepicker#info=devDependencies)
[](https://npmjs.org/package/bee-timepicker)
[](http://isitmaintained.com/project/tinper-bee/bee-timepicker "Average time to resolve an issue")
[](http://isitmaintained.com/project/tinper-bee/bee-timepicker "Percentage of issues still open")
react bee-timepicker component for tinper-bee
可定制的时间组件
## 使用
### 使用单独的timepicker包
#### 组件引入
先进行下载bee-timepicker包
```
npm install --save bee-timepicker
```
组件调用
```js
import Timepicker from 'bee-timepicker';
ReactDOM.render(
, document.getElementById('target'));
```
#### 样式引入
- 可以使用link引入build目录下TimePicker.css
```
```
- 可以在js中import样式
```js
import "./node_modules/bee-timepicker/src/Timepicker.scss"
//或是
import "./node_modules/bee-timepicker/build/Timepicker.css"
```
## API
|参数|说明|类型|默认值|
|:--|:---|:--|:---|
|prefixCls|prefixCls of this component|String|'rc-time-picker'|
|clearText|clear tooltip of icon|String|'clear'|
|disabled|禁用时间组件|Boolean|false|
|allowEmpty|允许为空|Boolean|true|
|open|current open state of picker. controlled prop|Boolean|false|
|defaultValue|默认值|moment|null|
|defaultOpenValue|默认打开的值|moment|moment()|
|value|当前值|moment|null|
|placeholder|输入框的placeholder|String|''|
|className|time picker className|String|''|
|popupClassName|弹出面板的ClassName|String|''|
|showHour|显示小时|Boolean|true|
|showMinute|显示分钟|Boolean|true|
|showSecond|显示秒|Boolean|true|
|format|格式化|String|-|
|disabledHours|禁用的小时|Function|-|
|disabledMinutes|禁用的分钟|Function|-|
|disabledSeconds|禁用的秒|Function|-|
|use12Hours|切换12小时制|Boolean|false|
|hideDisabledOptions|是否隐藏禁用选项|Boolean|false|
|onChange|改变时的回调行数|Function|null|
|addon|从时间选择面板称为渲染一些插件在它的底部，像一个OK按钮。接收板实例作为参数|Function|-|
|placement|one of ['left','right','top','bottom', 'topLeft', 'topRight', 'bottomLeft', 'bottomRight']|String|bottomLeft|
|transitionName|-|String|''|
|name|设置input的name属性|String|-|
|onOpen|打开时的回调|Function({ open })|-|
|onClose|关闭时的回调|Function({ open })|-|
#### 开发调试
```sh
$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-timepicker
$ cd bee-timepicker
$ npm install
$ npm run dev
```
---
_Source: https://npm.io/package/bee-timepicker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._