title: Bootstrap Dropdown not working in React
body: <p>I'm trying to get a dropdown working inside a form for one of my React components. Here is how I'm setting up the dropdown portion of the code, the following is inside a form parent tag which is inside the div tag that I'm returning.:</p>
  
  <pre><code>//&lt;div&gt;
  //&lt;form&gt;
  //some code here
  
      &lt;div className="row top-buffer"&gt;
          &lt;div className="col"&gt;
              &lt;div className="dropdown"&gt;
                  &lt;button 
                      className="btn btn-secondary dropdown-toggle" 
                      type="button" 
                      id="dropdownMenuButton" 
                      data-toggle="dropdown" 
                      aria-haspopup="true"&gt;
                      Dropdown
                  &lt;/button&gt;
                  &lt;div className="dropdown-menu" aria-labelledby="dropdownMenuButton"&gt;
                      &lt;a className="dropdown-item" href="#nogo"&gt;Item 1&lt;/a&gt;
                      &lt;a className="dropdown-item" href="#nogo"&gt;Item 2&lt;/a&gt;
                      &lt;a className="dropdown-item" href="#nogo"&gt;Item 3&lt;/a&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
  //some code here
  //&lt;/form&gt;
  //&lt;/div&gt;
  </code></pre>
  
  <p>However, when I click the Dropdown button, it does not display the dropdown menu and the items in it.</p>
  
  <p>All my other bootstrap components are working fine. What am I doing wrong?</p>
  
  <p>EDIT: </p>
  
  <p>I referenced bootstrap in my index.js:</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import './index.css';
  import App from './App';
  import 'bootstrap/dist/css/bootstrap.min.css'
  import './App.css'
  import registerServiceWorker from './registerServiceWorker';
  
  ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));
  registerServiceWorker();
  </code></pre>
  
  <p>Am I missing something?</p>