title: How customize reactstrap dropdown in reactJS
body: <p>Created sample application with ReactJS and install reactstrap for boostrap. I use dropdown components in application that is working fine. code is</p>
  
  <pre><code>&lt;Dropdown isOpen={this.state.dropdownOpen} toggle={this.toggle}&gt;
      &lt;DropdownToggle caret&gt;
        Dropdown
      &lt;/DropdownToggle&gt;
      &lt;DropdownMenu&gt;
        &lt;DropdownItem&gt;Another Action&lt;/DropdownItem&gt;
        &lt;DropdownItem&gt;Another Action&lt;/DropdownItem&gt;
      &lt;/DropdownMenu&gt;
  &lt;/Dropdown&gt; 
  </code></pre>
  
  <p>but i have to change . </p>
  
  <blockquote>
    <p>Like currently they passing text only</p>
  </blockquote>
  
  <p>. But </p>
  
  <blockquote>
    <p>I have to pass 3 things like icon,heading and sub heading</p>
  </blockquote>
  
  <p>so can I change DropdownItem.js code for this type of customization ?</p>
  
  <p>I have to make dropdown similar to this image <a href="http://prntscr.com/f34zoo" rel="nofollow noreferrer">http://prntscr.com/f34zoo</a></p>
  
  <p>Thanks in advance</p>