Tengo un Select que se ve así
<TextField id="year-select" select value={year ? year : "Select year"} onChange={(e) => setYear(e.target.value)} > <MenuItem value={moment().add(1, 'y')}>{moment().add(1, 'y').format('YYYY')}</MenuItem> .... <MenuItem value={moment().add(10, 'y').format('YYYY')}> {moment().add(10,'y').format('YYYY')} </MenuItem> </Textfield>Cuando el valor es igual al valor secundario del elemento de menú como el segundo elemento de menú en el ejemplo, el valor de visualización cambiará perfectamente, mientras que si es diferente, estará en blanco. Creo que esto proviene de la propiedad de valor en el campo de texto seleccionado, pero cambiarlo para tenerlo como el primer elemento del menú y luego formatear el valor en la propiedad tampoco funciona.
¿Hay alguien que conozca una solución que pueda usar que no sea crear un handleChange que maneje dos variables diferentes para mostrar y usar?
Debe completar la opción para Seleccionar año. Entonces ingrese un marcador de posición (dependiendo de su componente de campo de texto) o agregue un elemento de menú como este: <MenuItem value={"Select year"}>{"Select year"}</MenuItem> .