title: DropdownMenu and DropdownItem onClick with ReactJS / Reactstrap
body: <p>I want to have a dropdownMenu with dropdownItem, </p>
  
  <p>when I click on an item, it show the ref item</p>
  
  <p><a href="https://i.stack.imgur.com/fh7Fn.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fh7Fn.png" alt="enter image description here"></a></p>
  
  <p>But actually when I click, nothing happen</p>
  
  <p>toggle function : handle the dropdown</p>
  
  <p>handleClick: supposed to print my event Ref but it never throwed</p>
  
  <p>What I did : (I volontary delete some code to keep just the purpose of the question, this.props.currentEvents is well filled)</p>
  
  <pre><code>class DefaultHeader extends Component {
  
    constructor(props) {
      super(props);
  
      this.toggle = this.toggle.bind(this);
      this.state = {
        dropdownOpen: false,
        selectedEvents: "Choose Your Event",
      };
    }
  
    toggle() {
      this.setState({
        dropdownOpen: !this.state.dropdownOpen
      });
    }
  
    handleClick = (eventRef, name) =&gt; {
      console.log('toogle event ref', eventRef);
      this.setState({selectedEvents: name, selectedEventsID: eventRef});
  }
  
    render() {
      const { children, ...attributes } = this.props;
      return (
        &lt;React.Fragment&gt;
  
          &lt;ButtonDropdown className="info d-md-down-none" display="lg" mobile isOpen={this.state.dropdownOpen} toggle={this.toggle} style={{marginRight: 10}}&gt;
          &lt;DropdownToggle caret&gt;
           {this.state.selectedEvents}
          &lt;/DropdownToggle&gt;
          {this.props.currentEvents.map((event, index) =&gt; 
             &lt;DropdownMenu key={index}&gt;
                &lt;DropdownItem onClick={this.handleClick.bind(this,event.eventRef, event.name)}&gt;{event.name}&lt;/DropdownItem&gt;
             &lt;/DropdownMenu&gt;
          ): (&lt;DropdownMenu&gt;
                  &lt;DropdownItem&gt;You don't manage any event for the moment&lt;/DropdownItem&gt;
             &lt;/DropdownMenu&gt;)
  
        &lt;/React.Fragment&gt;
      );
    }
  }
  </code></pre>
  
  <p>I already used onClick function like this, and it works, but for dropdownMenu, it's not working, it look like the function is never called, or toggle is called instead of onClickHandle(),</p>
  
  <p>Any tips about it ? </p>