mic*_*mer 5 android android-timepicker reactjs react-native
我使用带有开始时间和结束时间的库创建了一个带有 react-native 的简单表单。我问我自己为什么我可以毫无问题地在 ios 上设置开始时间和结束时间,但是当我在官方文档中发现它不是预期的 min time 选项时,我无法在 android 中设置它。是否存在任何解决方法或一些黑客来解决这个问题?
该代码与示例中的代码非常相似,所以我没有提供它,但在这种情况下,我可以编辑消息。谢谢
根据文档,对于react-native-datepicker,Android不支持minDate。对于ios来说效果很好。
注意:使用prop -mode的“datetime”值。
我按照下面的方法解决了android中的问题。
<DatePicker
style={{width: 200}}
date={this.state.valueDate}
mode="datetime"
format="YYYY/MM/DD HH:mm"
minDate={new Date(Date.now()+(10 * 60 * 1000))} //To book after 10 minutes
confirmBtnText="Confirm"
cancelBtnText="Cancel"
customStyles={{
dateIcon: {
position: 'absolute',
left: 5,
top: 4,
marginLeft: 10
},
dateInput: {
marginLeft: 46
}
// ... You can check the source to find the other keys.
}}
onDateChange={(date) => { // returns 2019-10-15T23:23 - set in format prop
var selectedDate = new Date(date);
var dateNow = new Date();
var YYYY = dateNow.getFullYear();
var MM = dateNow.getMonth()+1;
var DD = dateNow.getDate();
var HH = dateNow.getHours();
var mm = dateNow.getMinutes()+10; //To book after 10 minutes
var minDate = new Date(YYYY+'/'+MM+'/'+DD+' '+HH+':'+mm)
var selectedYYYY = selectedDate.getFullYear();
var selectedMM = selectedDate.getMonth()+1;
var selectedDD = selectedDate.getDate();
var selectedHH = selectedDate. getHours();
var selectedmm = selectedDate.getMinutes();
if(Platform.OS == 'ios'){
this.setState({
valueDate:date,
date: selectedYYYY+'-'+selectedMM+'-'+selectedDD,
time: selectedHH+':'+selectedmm
})
}else{
if(selectedDate.getTime()<minDate.getTime()){ //getTime() - Get the time (milliseconds since January 1, 1970)
alert("You can book after 10 minutes from now!");
}else{
this.setState({
valueDate:date,
date: selectedYYYY+'-'+selectedMM+'-'+selectedDD,
time: selectedHH+':'+selectedmm
})
}
}
}
}
/>
Run Code Online (Sandbox Code Playgroud)
希望它会有所帮助!
| 归档时间: |
|
| 查看次数: |
5339 次 |
| 最近记录: |