Lm-datepicker NPM

datepicker

作者：caoxuewei
邮箱：caoxuewei@58ganji.com
版本：0.2.1

介绍

日期选择

安装

lm-* 组件使用 npm 进行管理，命名空间统一为 lm-，请使用以下命令进行组件安装。

npm i lm-datepicker --save

如果你还没有安装 npm，可通过以下方式进行安装。
安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org

使用

样例文档

待开发

使用

最少配置参数为：
- 传入showState显示时间选择器
```
<Datepicker showState={true} />
```

时间选择区间为当前时间往前10天，往后35天

<Datepicker 
    showState={this.state.show}
    passeddays={21}
    futuredays={35}
    onOk={this.onOk}
    onDismiss={this.onDismiss}/>

时间选择区间为 2016-10-11 ~ 2019-11-16,type为date

```
<Datepicker 
	showState={this.state.show}
	startTime="2016-10-11"
	endTime="2019-11-16"
	onOk={this.onOk}
	date="date"
	onDismiss={this.onDismiss}/>
```

时间选择区间为 2016-02-14 11:49 ～ 2019-11-01 10:39

<Datepicker
    showState={ this.state.show }
    startTime="2016-02-14 11:49"
    endTime="2019-11-01 10:39"
    selected={{
        year: 2019,
        month: 11,
        day: 1,
        hour: 10,
        minute: 49
    }}
    onOk={ this.onOk } 
    onDismiss = { this.onDismiss }
    />

时间选择区间为 11:49 ～ 10:39

<Datepicker
    showState={ this.state.show }
    startTime="11:49"
    endTime="10:39"
    selected={{
        hour: 10,
        minute: 49
    }}
    onOk={ this.onOk } 
    type="time"
    onDismiss = { this.onDismiss }
    />

配置参数

Prop	Type	Default	Description
`showState`	`bool`	`false`	控制时间选择器的显示隐藏
`passeddays`	`number`	`30`	单位天，开始时间为，当前时间 - passedDuration
`futuredays`	`number`	`30`	单位天，结束时间为，当前时间 + futureDuration
`startTime`	`string`	`undefined`	开始时间 '2012-10-30 11:30:00' ,优先级高于passedDuration
`endTime`	`number`	`undefined`	结束时间 '2018-10-30 12:30:00' ,优先级高于futureDuration
`selected`	`object`	`{year: 当前年份, month: 当前月份, day: 当前日期, hour: 当前时间, minute: 当前分钟}`	默认选中的年份、月份、日期、小时、分钟
`type`	`'datetime' 或 'date' 或 'time'`	`datetime`	选择类型 datetime日期时间选择,date日期选择,time时间选择
`opacity`	`number`	`0.5`	mask透明度，0 ~ 1
`onOk`	`func`	`args => args`	确定按钮回调函数
`onDismiss`	`func`	`args => args`	取消按钮回调函数