时间戳

首页 > 解决方案 > DateTimePicker Material UI 设置 minDate 30 分钟后

reactjs - DateTimePicker Material UI 设置 minDate 30 分钟后

问题描述

我正在使用 Material UIDateTimePicker并尝试将最小日期设置为从现在起 60 分钟，但无法弄清楚执行此操作的正确语法是什么。我现在的方式行不通。minTime正如我在一个教程中看到的那样，我尝试使用，但这给了我一个警告：

React does not recognize the `minTime` prop on a DOM element

有人能告诉我从现在开始将时间设置为 60 分钟的正确语法是什么吗？

我的DateTimePicker：

<MuiPickersUtilsProvider utils={DateFnsUtils}>
            <DateTimePicker
              required={true}
              id="select-due-date-time"
              label="Due date"
              name="dueDateTime"
              disablePast
              error={materialDateTimeInputError}
              value={dueDateTime}
              onChange={handleDateChange}
              minDate={new Date().getMinutes + 60}
              minDateMessage={"Due date must be at least 60 minutes from now"}
              helperText="Please select the due date for your request"
            />
          </MuiPickersUtilsProvider>

我也尝试过类似的方法，但也没有用minDate={new Date(new Date().getMinutes + 60)}

编辑：我尝试minDate={new Date(new Date().getTime() + 60*60*1000)}按照评论中的建议使用。不幸的是，那没有用。甚至可以设置 controlminTime的分钟吗？到目前为止，这个属性只对我有用了好几天。

标签： reactjsmaterial-uidatetimepicker

解决方案

我有同样的问题，我可以确认minDate它只工作几天而不是几小时/分钟/秒。

这里举个例子。

如果你minDate这样写：

<DateTimePicker
    value={this.state.date || Date.now()}
    onChange={this.handleDateChange}
    format="hh:mm DD.MM.YYYY"
    autoOk
    ampm={false}
    minDate={new Date().setHours(new Date().getHours() + 1)}
  />

给你相同的结果：

<DateTimePicker
    value={this.state.date || Date.now()}
    onChange={this.handleDateChange}
    format="hh:mm DD.MM.YYYY"
    autoOk
    ampm={false}
    minDate={new Date()}
  />

我尝试了多次（也通过使用moment），但结果是一样的。一种可能的解决方法是验证onChange事件中的日期并在日期距离现在不到一小时的情况下显示错误（很差，但这是我发现的唯一方法）。

推荐阅读