DatePicker
一个全屏遮罩的日期/时间选择器,支持 'date', 'time', 'datetime' 三种mode。
属性
minDate Date
可以选择的最小时间,isRequired
maxDate Date
可以选择的最大时间,isRequired
date Date
初始化时当前选择的时间,isRequired
mode enum('date', 'time', 'datetime')
支持date, time, datetime
三种模式,date
为选择日期,time
为选择时间,datetime
为选择日期和时间,默认为date
minuteInterval enum(1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30)
可选的最小的分钟单位。mode为time
或datetime
时有效
onDateSelected Function
选择日期完成的回调,参数是选择的日期 Date
titleText string
标题
subTitleText string
副标题
方法
toggle (withAnimate=true)
展示或者隐藏 DatePicker(true 显示动画,false不显示动画)
示例:
_onPressHandle() {
this.picker.toggle();
}
render() {
return (
<
View style={{height: Dimensions.get('window').height}}
>
<
TouchableOpacity style={{marginTop: 20}} onPress={this._onPressHandle.bind(this)}
>
<
Text
>
Click Me
<
/Text
>
<
/TouchableOpacity
>
<
DatePicker
ref={picker =
>
this.picker = picker}
date={new Date(2016,5,20)}
mode="date"
minDate={new Date(2016,4,20)}
maxDate={new Date(2016,10,20)}
onDateSelected={(date) =
>
{
alert(JSON.stringify(date.getFullYear() + "- " + (date.getMonth() + 1) + "- " + date.getDate()));
}}
/
>
<
/View
>
);
}