title: Vuejs v-show is not working as expected
body: <p>I have a form to add new items to my array, but would like to hide the form until the user is ready to add an item.  The form is hidden and I have a <code>@click</code> function attached to an icon to toggle the form to show, which is also working. But, as soon as the form is toggle to show, it hides automatically within a few seconds.</p>
  
  <p><strong>@click icon</strong></p>
  
  <pre><code>&lt;li class="m-portlet__nav-item"&gt;
    &lt;a href="" class="m-portlet__nav-link m-portlet__nav-link--icon" @click="isSection ^= true"&gt;
      &lt;i class="flaticon-add"&gt;&lt;/i&gt;
    &lt;/a&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p><strong>form</strong></p>
  
  <pre><code>&lt;div class="row" v-show="isSection"&gt;
    &lt;div class="col-md-12"&gt;
      &lt;div style="border: 1px solid #fcfcfc; padding: 1em"&gt;
        &lt;h5&gt;Add New Section&lt;/h5&gt;
        &lt;hr&gt;
        &lt;form v-on:submit.prevent="addNewSection"&gt;
          &lt;div class="form-group m-form__group"&gt;
            &lt;input v-model="sections.name" placeholder="Name" class="form-control m-input" style="margin-bottom: .5rem"/&gt;
            &lt;textarea v-model="sections.description" placeholder="Description" class="form-control m-input" style="margin-bottom: .5rem"/&gt;&lt;/textarea&gt;
            &lt;button type="submit" class="btn btn-primary"&gt;Add Section&lt;/button&gt;
          &lt;/div&gt;
        &lt;/form&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>script</strong></p>
  
  <pre><code>new Vue({
      el: "#main",
      data: {
          isSection: false,
          ...
  </code></pre>
  
  <p><strong>addNewSection</strong></p>
  
  <pre><code>addNewSection() {
      this.sections.push(
          {
              name: this.sections.name,
              description: this.sections.description,
              items: []
          }
      );
      this.sections.name = "";
      this.sections.description = "";
  },
  </code></pre>