0
346
ViewsNo se puede deshabilitar el cambio de fecha del teclado en la API DatePicker de MUI
Enlace a CodeSandBox: codesandbox.io/s/dl5jft?file=/demo.tsx
No quiero que los usuarios editen fechas a través del teclado, quiero que seleccionen fechas del modal del selector de fechas, ¿cómo deshabilitar esto?
,
Utilicé ReadOnly prop pero está deshabilitando la selección de fecha en sí misma, por favor ayuda cuando hice readOnly, está deshabilitando toda la entrada, lo que me impidió abrir el modal para seleccionar la fecha
<GlobalStyle /> <CalendarContainer> <LocalizationProvider dateAdapter={AdapterDateFns}> <DatePicker value={calendarVal} onChange={(newValue) => { handleChange(newValue); }} disabled={disabled} inputFormat="dd-MM-yyyy" renderInput={(params) => ( <TextField // eslint-disable-next-line react/jsx-props-no-spreading {...params} name={name} error={error} disabled={disabled} /> )} /> </LocalizationProvider> </CalendarContainer>
·
Juan Pablo Isaza
1 answers
Answer question0
Para evitar las acciones del teclado del usuario, puede configurar la funcionalidad del evento onKeyDown para preventDefault y asignarlo a TextField :
const onKeyDown = (e) => { e.preventDefault(); }; return ( <LocalizationProvider dateAdapter={AdapterDateFns}> <Stack spacing={3}> <DesktopDatePicker label="Date desktop" inputFormat="MM/dd/yyyy" value={value} onChange={handleChange} renderInput={(params) => ( <TextField onKeyDown={onKeyDown} {...params} /> )} /> ) 
·
Juan Pablo Isaza
Report
Answer question