Tengo un pequeño problema y no he tenido mucha suerte para encontrar una solución. El MUI DatePicker parece tener un formato que tiene por defecto, para mostrar las fechas como

 Fri Oct dd yyyy HH:MM:SS GMT+HHMM (name of timezone here)

Sin embargo, necesito poder pasar una fecha en el formato de

yyyy-MM-ddThh:MM:ss+HH:mm que es (Date)T(Time)+(Timezone)

al componente, y luego volver a ser enviado en el mismo formato.

En algunos casos, el valor de este selector de fecha y hora no está establecido; en otros, sí lo está. Y no estoy seguro de cómo obtener el formato que necesito, ya que no tengo control sobre el formato de fecha que estoy recibiendo.

Parece que el componente puede analizar los datos que le doy y establecer el valor adecuado, pero los nuevos datos (si el valor cambia) están en un formato diferente.

editar: solo un ejemplo rápido para arriba.

 Data I get: 2020-10-11T15:56:28+11:00

Datos que genera el componente: { "$L": "en", "$u": undefined, "$d": Date Sun Oct 11 2020 15:56:28 GMT+1100 (Australian Eastern Daylight Time), "$x": {}, "$y": 2020, "$M": 9, "$D": 11, "$W": 0, "$H": 15, "$m": 56, … }

Código relevante para DateTimePicker:

 import React from 'react'; import TextField from '@mui/material/TextField'; import DateTimePicker from '@mui/lab/DateTimePicker'; export default function DateTimePickerComponent(props) { const [value, setValue] = React.useState(null); const onDatePicked = (event) => { setValue(event); let onlyDate = event.$d; props.onChange(onlyDate); console.log("Date Changed", event, onlyDate); }; React.useEffect(() => { if (props.initialValue !== 0 && value === null) { setValue(props.initialValue); console.log("Initial Date is", props.initialValue); } }, [props.initialValue, value, setValue]); return ( <DateTimePicker label={props.label} value={value} onChange={onDatePicked} renderInput={(params) => <TextField {...params} />} /> ); }