Reaccioné Text Field con defaultValue. En defaultValue, configuré el valor usando accesorios. Pero necesito configurar el evento onchage() en ese campo de texto, entonces puedo actualizar mi valor de TextField. Pero no puedo configurarlos. Cuando trato de establecer un valor, mi valor predeterminado no se muestra.
const [openingHours, setOpeningHours] = useState({ monday: '', }); const mondayHandler = (event) => { const temp = {...openingHours}; temp.monday = event.target.value; setOpeningHours(temp); }; <TextField type="time" defaultValue={props.times[0].time1 !== undefined ? props.times[0].time1 : '00:00'} className={classes.textField} InputLabelProps={{ shrink: true, color: 'blue', }} InputProps={{ classes: { underline: classes.underline, root: classes.timeRoot, }, }} />¿Cómo configurar el evento Onchange en este campo de texto?
Descargo de responsabilidad: supongo que está utilizando el componente TextField material-ui . Si me equivoco, esta respuesta podría no contener el agua.
Al usar value y onChange para controlar el estado del TextField, está creando lo que algunas personas llaman una "entrada controlada". La propiedad defaultValue está destinada a usarse con entradas no controladas, no controladas. En su lugar, puede establecer un valor predeterminado proporcionando el valor inicial correcto a useState .
Lo que estoy sugiriendo sería algo como:
const [openingHours, setOpeningHours] = useState({ monday: '00:00', }); const mondayHandler = (event) => { const temp = {...openingHours}; temp.monday = event.target.value; setOpeningHours(temp); }; <TextField type="time" value={openingHours.monday} onChange={mondayHandler} ... /> Deberá verificar que 00:00 sea un valor válido para un TextField con type="time" . Es posible que deba proporcionar un objeto de fecha de Javascript en su lugar.