Set selected value for Semantic-UI Dropdown in React


Hi guys,

I am trying to set the selected value for a semantic-ui dropdown. But whatever I am doing, it does not work. Does anybody have experience in this issue? Thank you

class WebsitesDropdown extends Component {

	componentDidMount() {

			onChange: function(value, text, $selectItem) {


	componentDidUpdate() {

		let currentWebsiteSlug = FlowRouter.getParam("website_id");
               //this does not work, the currentWebsiteSlug is a correct value
		$('#websites-dropdown').dropdown('set selected', currentWebsiteSlug);


	render() {

		let websiteSlug = FlowRouter.getParam("website_id");

			<div className="ui dropdown item" id="websites-dropdown">
				<i className="folder open outline icon left"></i>
				<div className="default text">Select Website</div>
				<i className="dropdown icon"></i>
				<div className="menu">
				{, i) => {

					//this class does not work either to set selected
					let selected = websiteSlug === website.slug ? 'active selected' : '';
					return (
						<div className={"item "+selected} data-id={website._id} data-value={website.slug} key={website._id}>{}</div>


export default createContainer(() => {


	return {
		websites: Websites.find({}).fetch()

}, WebsitesDropdown);