如何在TimePickerAndroid中为react-native设置最小日期

时间:2018-04-24 10:32:48

标签: android reactjs react-native android-timepicker

我使用此library创建了一个带有react-native的简单表单,其中包含开始时间和结束时间。 我问自己为什么我可以在ios上设置没有问题的开始时间和结束时间,但是当我在official documentation中发现它不是预期的最小时间选项时,我无法在android中设置它。 是否存在任何解决方法或一些黑客来解决这个问题? 代码与示例中的代码非常相似,所以我没有提供它,但在这种情况下我可以编辑消息。 感谢

1 个答案:

答案 0 :(得分:1)

根据文档,对于 react-native-datepicker ,Android不支持minDate。它适用于ios。

注意::在 prop 模式下使用“ 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
                            })
                          }
                        }

                      }
                        }

                    />

希望这会有所帮助!