react-datetime：如何通过按钮将时间设置为 now()

Question

我希望用户使用按钮 Immediate 轻松地将时间设置为当前时间。而不是 select 手动设置当前时间。

我正在尝试以下


const [currentDateTime, setcurrentDateTime] = useState(null);
<Datetime
    inputProps={{
        placeholder: "MM-DD-YYYY HH:mm",
        required: true,
    }}
    viewMode="time"
    value={currentDateTime} <--- THE PROBLEM WITH THIS IS, IT DOES NOT SET THE SELECTED DATETIME.
/>
<Button color="primary" className="ml-1" onClick={() => setcurrentDateTime(new Date())}>
    {"Immediate"}
</Button>

要使用 Immediate 按钮值，我正在使用 value={currentDateTime}。但是这不允许我使用 selected 值

如何做到这一点。当我按下 Immediate 按钮时有 new Date() 值。当我 select 一个日期时间

时具有 selected 值

Answer 1

发生这种情况是因为您尚未将 onChange 事件添加到 Datetime:

const [currentDateTime, setcurrentDateTime] = useState(null);

  return (
    <>
      <Datetime
        inputProps={{
          placeholder: "MM-DD-YYYY HH:mm",
          required: true
        }}
        viewMode="time"
        value={currentDateTime}
        onChange={setcurrentDateTime} // <--- You need to add onChange 
      />
      <Button
        color="primary"
        className="ml-1"
        onClick={() => setcurrentDateTime(new Date())}
      >
        {"Immediate"}
      </Button>
    </>
  );

检查此 CodeSandbox：

react-datetime：如何通过按钮将时间设置为 now()

react-datetime: How to set the time to now() from a button

reactjs

react-datetime