javascript - React Semantic UI Dropdown get name of current selection, pass to child component

Question

In my React application I'm using Semantic UI's Dropdown components. When an option in the dropdown is selected (onClick) I want to be able to get the text value of the current dropdown selection and send that string to another component as a prop.

Below is what my render method in the component looks like as of right now. I image the Dropdown would have to have an onClick method execute that grabs the value of the selection just clicked, and then send that as a prop to the <CookbookSelection /> component adjacent to the dropdown.

render() {
    return (
        <div>
            <Dropdown
                id="thing"
                placeholder={this.props.defaultCookbook}
                fluid
                selection
                options={this.props.cookbookData}
                onChange={this.props.setCurrentCookbook}
            />
            <CookbookSelection />
        </div>
    );
}

Any help understanding how to do this? Thanks.

question from:https://stackoverflow.com/questions/65661581/react-semantic-ui-dropdown-get-name-of-current-selection-pass-to-child-componen

Answer 1

Waitting for answers