title: How to close dialog by self with vuejs2?
body: <p>I am writing a dialog component, i don't know how to close dialog by self.</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class="dialog" v-show="visible"&gt;
      ...
      &lt;button @click="close"&gt;Close&lt;/button&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  &lt;script&gt;
    {
      props: {visible: {type: Boolean, default: false}},
      methods: {
        close () {
          // this.visible = false //It will get vue warn
        }
      }
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>So, how to close the dialog in my component, i can't update <code>visible</code> prop, i will get a error.</p>
  
  <pre><code>Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "visible"
  </code></pre>