语义UI反应下拉列表:您可以动态设置值吗?

我使用的下拉列表来自 semantic-ui-react 。语义ui下拉列表在我的 Artists 组件,并且该组件正在使用其父组件, App 。

现在下拉列表工作正常,如果您从下拉列表中选择一个名称(艺术家),则 handleArtistSelection 函数是用传入的艺术家的名字调用的。大部分代码如下。

但是,还有其他方法可以设置下拉列表的值吗?例如,在jquery中,您可以使用:

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

应用程序组件

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>
     )

}

艺术家部分:

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}/>
    )
}