title: Vuetify - How to handle click event on <v-btn>?
body: <p>I'm new to <code>vuetify</code> and <code>vue</code>, trying to figure out how to handle click event on <code>&lt;v-btn&gt;</code>. <em>(Using <code>vue 2.6.10</code> and <code>vuetify 2.0.0</code>)</em></p>
  
  <p><em>(Surprised that didn't find a single code snippet that could work, after searching in both vuetify official document &amp; via Google.)</em></p>
  
  <hr>
  
  <h2>Code</h2>
  
  <ul>
  <li><p>Button</p>
  
  <p><code>&lt;v-btn color="primary" rounded @onclick.native="startQuiz"&gt;Start&lt;/v-btn&gt;</code></p></li>
  <li><p>Handler method from <code>methods</code> part of the containing component.</p>
  
  <pre><code>startQuiz() {
    console.log('start');
    alert('start');
  }
  </code></pre></li>
  </ul>
  
  <p>After click the button, can't see console output from browser, neither did the alert pop-up.</p>
  
  <p>In browser's vue plugin, under the <code>Events</code> sub tab, I can see following events:</p>
  
  <blockquote>
    <p><code>click $emit by &lt;VBtn&gt;</code></p>
  </blockquote>
  
  <hr>
  
  <h2>Questions</h2>
  
  <ul>
  <li>How to make the <code>startQuiz</code> method called when click the button?</li>
  </ul>
  
  <hr>
  
  <h2>Update - Summary</h2>
  
  <p>I checked following link:</p>
  
  <p><a href="http://stackoverflow.com/questions/45369553/difference-from-click-and-v-onclick-vuejs">http://stackoverflow.com/questions/45369553/difference-from-click-and-v-onclick-vuejs</a></p>
  
  <p>Turns out it's just a shorthand for <code>v-on:click</code>, and <code>onclick</code> is from javascript, and invalid in vue's context.</p>