title: Modal pop up in Nuxt
body: <p>I'm trying to create a component in nuxt that creates cards as well as modal pop-ups for each of those cards.</p>
  <p>I have a <code>showModal</code> variable set to false and a button changing that value to true, from what I've read all I need to do is add <code>v-show</code> to my modal and whenever I click the button it should show a modal with different content depending on which card I click, but nothing happens. I can even see the value being changed to true, but no modal.</p>
  <p>This is my Template</p>
  <pre class="lang-html prettyprint-override"><code>    &lt;section&gt;
          &lt;div&gt;
              &lt;div v-for=&quot;item in items&quot;&gt;
                  &lt;div&gt;
                      &lt;img :src=&quot;item.src&quot; :alt=&quot;item.alt&quot; /&gt;
                      &lt;div&gt;
                          &lt;h2&gt; {{item.title }} &lt;/h2&gt;
                          &lt;p&gt;{{ item.content }}&lt;/p&gt;
                         &lt;!-- Triggers the modal --&gt;
                          &lt;button click=&quot;showModal = true&quot;&gt;Learn More&lt;/button&gt;
                         &lt;!-- Triggers the modal --&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                 &lt;!-- The Modal --&gt;
                  &lt;div&gt;
                      &lt;div v-show=&quot;showModal&quot; @click=&quot;$emit('close-modal')&quot;&gt;
                          &lt;div v-for=&quot;item in items&quot; @click.stop&gt;
                              &lt;h6&gt;{{ item.title }}&lt;/h6&gt;
                              &lt;p&gt;{{ item.extContent }}&lt;/p&gt;
                              &lt;button click=&quot;$emit('close-modal')&quot;&gt;Close&lt;/button&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                 &lt;!-- The Modal --&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  <p>This is my script</p>
  <pre class="lang-js prettyprint-override"><code>export default {
      name: &quot;Showcase&quot;,
      data() {
          return {
              showModal: false,
              items: [
                  { src: 'img', title: 'title', content: 'some content', extContent: 'some extended content', alt: 'img' },
              ]
          };
      },
  }
  
  </code></pre>
  <p>Please let me know if you need any further info.</p>
  <p>Thank you :)</p>