title: React-bootstrap modal not popping up even after showModal is set to true
body: <p>I have used this in previous projects and it worked just fine. I thought that maybe the <code>state</code> of <code>showModal</code> wasn't getting set, but it is getting set to true when I click the pictures. I will post code below.</p>
  
  <p>Please let me know if you need anymore information rather than spamming the down-vote, help create a better community :)</p>
  
  <pre><code>import React, { Component } from 'react';
  import { Modal } from 'react-bootstrap';
  
  class Gallery extends Component {
    constructor(props) {
      super(props);
  
      this.state = {
        showModal: false
      };
    }
  
    render() {
      console.log(this.state);
      const { gallery } = this.props;
      return (
        &lt;section id="gallery" className="three"&gt;
          &lt;div className="container"&gt;
            &lt;header&gt;
              &lt;h2&gt;{gallery ? gallery.title : 'Select A Gallery'}&lt;/h2&gt;
            &lt;/header&gt;
            &lt;div className="card-deck"&gt;
              {gallery
                ? gallery.images.map((image, i) =&gt; (
                    &lt;div key={i} className="card"&gt;
                      &lt;img
                        onClick={() =&gt; {
                          this.setState({ showModal: true });
                        }}
                        className="card-img"
                        src={`${image}=s1000-c`}
                        alt="Card image cap"
                      /&gt;
                    &lt;/div&gt;
                  ))
                : null}
            &lt;/div&gt;
            &lt;Modal
              bsSize="sm"
              show={this.state.showModal}
              onHide={() =&gt; this.setState({ showModal: false })}
            &gt;
              &lt;Modal.Header closeButton&gt;
                &lt;Modal.Title&gt;Purchase Item&lt;/Modal.Title&gt;
              &lt;/Modal.Header&gt;
              &lt;Modal.Body&gt;Hello&lt;/Modal.Body&gt;
            &lt;/Modal&gt;
          &lt;/div&gt;
        &lt;/section&gt;
      );
    }
  }
  
  export default Gallery;
  </code></pre>
  
  <p>EDIT: modal is showing up upon <code>inspect</code> here are two pictures to show:
  <a href="https://i.stack.imgur.com/dXX7q.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/dXX7q.png" alt="enter image description here"></a></p>
  
  <hr>
  
  <p><a href="https://i.stack.imgur.com/wpraf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wpraf.png" alt="enter image description here"></a></p>