title: Adding a icon to React Bootstrap Dropdown
body: <p>I'm trying to add an icon to my react dropdown button as shown in the following button. </p>
  
  <p><a href="https://i.stack.imgur.com/cn0b0.png" rel="noreferrer"><img src="https://i.stack.imgur.com/cn0b0.png" alt="enter image description here"></a></p>
  
  <p>I couldn't find a way to implement this with the react bootstrap package i'm using.</p>
  
  <p><a href="https://react-bootstrap.github.io/" rel="noreferrer">https://react-bootstrap.github.io/</a></p>
  
  <p>I tried using the normal bootstrap 4 to to this. But found out that it needs jquery to open the dropdown menu. How can i add a icon to my react bootstrap drop down?</p>
  
  <p>My code</p>
  
  <pre><code>   &lt;DropdownButton id="example-month-input-2" title={this.state.weekselectedType}&gt;
           &lt;Dropdown.Item onClick={() =&gt; this.changeWeekValue('a')}&gt;A&lt;/Dropdown.Item&gt;
           &lt;Dropdown.Item onClick={() =&gt; this.changeWeekValue('b')}&gt;B&lt;/Dropdown.Item&gt;
           &lt;Dropdown.Item onClick={() =&gt; this.changeWeekValue('c')}&gt;C&lt;/Dropdown.Item&gt;
     &lt;/DropdownButton&gt;
  </code></pre>
  
  <p>I managed to remove the default dropdown icon using the following css</p>
  
  <pre><code>.dropdown-toggle::after {
      display:none !important;
  }
  </code></pre>