Estoy usando la interfaz de usuario semántica de React. Estoy renderizando un menú desplegable. He escrito un código tal que, una vez que se selecciona una opción, el texto de opciones se muestra en el campo. Pero cuando selecciono una opción del menú desplegable, el texto del valor seleccionado no se muestra, sino que muestra un campo vacío.

Aquí está mi código desplegable:

 options = [ { key:"a", value: 1, name: 'uni', text: "first"}, { key:"b", value: 2, name: 'duo', text: 'second'}, { key:"c", value: 3, name: 'tri', text: ' third'}, { key:"d", value: 4, name: 'quart', text: 'fourth'}, { key:"e", value: 5, name: 'cinq', text: 'sixth'}, { key:"f", value: 6, name: 'dernier', text: 'last'} ]; const handleDropDownSelect = (event, data) => { onChangeValue(data.value) }; const Dropdown = () => ( return( <Dropdown placeholder = abc" fluid selection options={options} onChange={handleDropDownSelect} />) <DropDownContainer className="Dropdown"> <Dropdown /> </DropDownContainer>

onChangeValue es una función que estoy usando en un componente diferente donde obtengo el valor de este menú desplegable y actualizo otros componentes. Entonces, el problema es que, cuando selecciono una opción, el texto debe mostrarse en el campo desplegable, no dejarse en blanco.