javascript - 不允许时间更改 React-DatePicker

Question

我使用React-DatePicker包和 momentjs 让用户在输入中选择一个日期，如下所示：

我想显示时间，但不让用户直接从<input>. 我的日期选择器有一个onChange()功能：

onExpirationDateChange(date) {
   this.setState({selectedTime: date.unix()});
}

有谁知道我如何实现显示时间，但不让用户更改它？

Answer 1

我会推荐这种方式：

document.getElementsByTagName("inputdate")[0].setAttribute("readonly", "readonly"); 

正如您可能知道的那样，它设置为只读，因此无法再在输入中写入，但如果需要，他们仍然可以复制文本。

Answer 2

根据此页面上的示例：https ://reactdatepicker.com/

您可以尝试这样做以防止用户选择时间...

<DatePicker
  selected={this.state.startDate}
  onChange={this.handleChange}
  showTimeSelect
  excludeTimes={[moment().hours(17).minutes(0), moment().hours(18).minutes(30), moment().hours(19).minutes(30)], moment().hours(17).minutes(30)}
  dateFormat="LLL"
/>

Answer 3

自己找到了答案。只需readOnly在选择器上设置并确保不包括时间选择选项。