javascript - react-datetime - 无法编辑日期或时间

Question

当单击输入框并输入有效内容时，输入将被清除，或者一些随机日期和时间将分配给此输入。

它允许我用鼠标选择日期或时间。无论何时输入，输入都会清除或分配随机值。

<Datetime
  value={moment(date)}
  onChange={(date) => setDate(date)}
  dateFormat="DD/MM/YYYY"
  timeFormat="HH:mm:ss"
  utc={true}
/>

当尝试使用“defaultValue”而不是“value”时，这将允许输入日期或时间，但它不会出现我通过我的反应状态传递的“日期”值。

<Datetime
  defaultValue={moment(date)}
  onChange={(date) => setDate(date)}
  dateFormat="DD/MM/YYYY"
  timeFormat="HH:mm:ss"
  utc={true}
/>

图片参考

score 0 · Accepted Answer

您的最佳示例是正确的。您已经构建了一个“受控组件”。日期存储在您的date状态变量中。每当发生更改时，该值都会更新并且元素将重新呈现。当元素呈现时，它会显示value.

问题是您将原始用户输入发送到 Moment 库，它返回一个奇怪的日期/时间。您需要先“修复”用户的输入，然后再将其传递给 Moment，老实说，没有理由做那么多工作。我会在互联网上寻找更好的日期/时间组件。（Moment 也被认为是旧的。现在人们更喜欢date-fns。）

1 回答 1