Vuetify-如何处理<v-btn>​​上的点击事件？

Question

我是vuetify和vue的新手，试图弄清楚如何处理<v-btn>上的点击事件。 （使用vue 2.6.10和vuetify 2.0.0）

（惊讶的是，在通过vuetify官方文档和Google进行搜索之后，没有找到一个可以正常工作的代码段）。

---

代码

• 按钮

  <v-btn color="primary" rounded @onclick.native="startQuiz">Start</v-btn>

• 包含组件的methods部分中的处理程序方法。

  startQuiz() {
    console.log('start');
    alert('start');
  }
  

单击按钮后，看不到浏览器的控制台输出，也没有弹出警报。

在浏览器的vue插件的Events子标签下，我可以看到以下事件：

  

click $emit by <VBtn>

---

问题

• 如何使单击按钮时调用startQuiz方法？

---

更新-摘要

我检查了以下链接：

http://stackoverflow.com/questions/45369553/difference-from-click-and-v-onclick-vuejs

结果证明，这只是v-on:click的简写，而onclick来自javascript，在vue的上下文中无效。

Answer 1

我建议您阅读VueJS Events Docs，在那里您将获得所需的一切。 有一个文档示例：

<div id="example-2">
  <!-- `greet` is the name of a method defined below -->
  <button v-on:click="greet">Greet</button>
</div>

var example2 = new Vue({
  el: '#example-2',
  data: {
    name: 'Vue.js'
  },
  // define methods under the `methods` object
  methods: {
    greet: function (event) {
      // `this` inside methods points to the Vue instance
      alert('Hello ' + this.name + '!')
      // `event` is the native DOM event
      if (event) {
        alert(event.target.tagName)
      }
    }
  }
})

Answer 2

以这种方式进行；

Just[T]