MUI DatePicker (ya sea de Labs o X) funcionaba bien. No puedo averiguar qué sucedió, pero ahora se cuelga si quiero cambiar la fecha por diez años. Parece que el código entra en un bucle infinito, pero no hay salida a la consola. el codigo es
function DateSelector(props) { const setValue = value => { if (value !== null) { const checked = checkDate(value); props.handler(checked); } } return ( <DatePicker label={props.label} inputFormat="d/M/y" mask="" value={props.date} onChange={(value) => { setValue(value); }} renderInput={(params) => ( <Tooltip title={"select " + props.label + " date"} arrow> <TextField size="small" {...params} /> </Tooltip> )} /> ); }props.date es un estado de nivel de aplicación que se transmite al componente selector. checkDate es una función simple para garantizar que la fecha esté en el rango correcto (lo he probado y, por lo que puedo ver, no es la causa del problema). props.handler cambia el estado del nivel de la aplicación. Me pregunto si el problema es que estoy manipulando el estado en el nivel de la aplicación directamente a través del selector.
¡Esto ya está resuelto!
El problema aquí es que props.date es un objeto de fecha almacenado como un estado de la aplicación que se pasa al componente. ¡El componente está modificando esto directamente! En su lugar, debería funcionar con una copia profunda del objeto de fecha.
En vez de
value={props.date}deberia tener
value={new Date(props.date.getTime())}