Estoy usando un menú desplegable de semantic-ui-react . El menú desplegable de la interfaz de usuario semántica está en mi componente Artists y ese componente se está utilizando como su componente principal, App .

En este momento, el menú desplegable funciona bien, si selecciona un nombre (artista) del menú desplegable, se llama a la función handleArtistSelection con el nombre de ese artista pasado. La mayor parte del código está debajo.

Pero, ¿hay otra forma de establecer el valor del menú desplegable? Por ejemplo en jquery puedes usar:

 $("#mydropdownlist").val("thevalue").change();

Componente de la aplicación

 export default function App() { const handleArtistSelection = (artist) => { ... }; const artistOptions = artistArray.map((artist) => { return {text: artist, value: artist} }); return ( <div className="App"> <h1>Explore Music Award Show Winners</h1> <Artists options={artistOptions} onArtistChange={handleArtistSelection} placeholder={'Pick an artist'}/> </div> ) }

Componente de artistas:

 import {Dropdown} from 'semantic-ui-react'; export default function Artists (props) { const handleOnChange = (e, data) => { props.onArtistChange(data.value); } return( <Dropdown placeholder={props.placeholder} search selection options={props.options} onChange={handleOnChange}/> ) }