DatePicker 是否反应具有“值”属性作为输入？答案

【问题标题】：Does DatePicker react have the "value" attribute as input?DatePicker 是否反应具有“值”属性作为输入？
【发布时间】：2023-04-10 20:31:16
【问题描述】：

DatePicker 反应是否将“值”属性作为输入？是否可以将新值分配给 DatePicker 组件中的属性 'value' -> value = {this.state.dates.date} （库日期选择器）就像我在输入中所做的那样？

预期效果：我使用 datepicker 选择日期 -> 稍后我从 datapicker 中选择一个新日期并覆盖之前的日期

this.state = {
    startDate: new Date()
}

 handleChange = (date) => {
    this.setState({
      startDate: date
    });
  }

<DatePicker 
  value = {this.state.startDate} //???????
  selected={this.state.startDate}
  onChange={this.handleChange}
  showTimeSelect
  timeFormat="HH:mm"
  timeIntervals={15}
  dateFormat="yyyy-MM-dd || HH:mm"
  timeCaption="time"
/>

<input type="text" value={this.state.dates.date} />

【问题讨论】：

以前的值是什么意思？
@JuniusL。正确的。将“以前”更改为“新”。
应该由onChange处理，当值改变时，它会更新输入中的值。
请发布您的更改处理函数。
@JuniusL。更新

标签： javascript reactjs datepicker

【解决方案1】：

使用来自here 的代码，如果您想获取上一个日期，请在您的editForm/Todo 组件中添加一个取消按钮，当它被点击时它将取消编辑并且不会保存新日期。

onCancel = () => {
  this.setState({
    isEditing: false,
  });
}

DEMO

【讨论】：

【解决方案2】：

因为你把日期放在一个数组中，所以你做的方式是不可能的。所以你必须告诉数组的哪个索引值应该是。但是，如果它只能是一个日期，那么数组就没有用了。您使用 startdate 和日期数组的场景对我来说并不清楚，但是...

如果您想将日期保存在数组中，那么它将是：

value = {this.state.dates[0].date}

或者如果你总是想使用数组中的最后一个日期

value = {this.state.dates[this.state.dates.length- 1].date}

但是，如果可能的话，我会考虑在您所在的州为 Datepicker 使用一个日期字段

【讨论】：

你说得对。我想取旧日期并用新日期替换，编辑它
是的，我看到了您的编辑。您在该州的初始值为 newDate。你有没有在某处宣布 newDate ？也许您想改用new Date()？
我想选择新日期并替换旧日期
是的，但您需要一个初始值才能开始，对吧？开头显示的值。因此，您所在州的值 newDate 应该在某个地方定义。您可以使用this.state = { startDate: new Date() } 将当前日期用作初始值。
我忘了括号