Cuando se hace clic en el cuadro de entrada y se escribe algo válido, la entrada se borrará o se asignará una fecha y hora aleatorias a esta entrada.
Me permite seleccionar fecha u hora con el mouse. Siempre que escriba, la entrada borrará o asignará valores aleatorios.
<Datetime value={moment(date)} onChange={(date) => setDate(date)} dateFormat="DD/MM/YYYY" timeFormat="HH:mm:ss" utc={true} />Al intentar con "valor predeterminado" en lugar de "valor", esto permitirá escribir la fecha o la hora, pero no aparecerá el valor de "fecha" que pasé a través de mi estado de reacción.
<Datetime defaultValue={moment(date)} onChange={(date) => setDate(date)} dateFormat="DD/MM/YYYY" timeFormat="HH:mm:ss" utc={true} />Referencia de imagen
Tu ejemplo principal es correcto. Has construido un 'componente controlado'. La fecha se almacena en su variable de estado de date . Cada vez que se produce un cambio, ese valor se actualiza y el elemento se vuelve a representar. Cuando el elemento se representa, muestra el value .
El problema es que está enviando la entrada del usuario sin procesar a la biblioteca Moment y está devolviendo una fecha/hora extraña. Deberá "arreglar" la entrada del usuario antes de pasarla a Moment y, sinceramente, no hay razón para hacer tanto trabajo. Buscaría en Internet y encontraría un mejor componente de fecha/hora. (También Moment se considera antiguo. La gente prefiere date-fns en estos días).
Ver también: Reaccionar componente controlado