javascript - Card 组件的按钮单击在 Vuetify 中不起作用

Question

我用一个Vuetify 的Card组件，在动作中你可以创建按钮。

但我注意到点击这些按钮不起作用（Codepen）：

<v-card-actions>
    <v-btn flat color="orange" @click="alert(888)">Share</v-btn>
    <v-btn flat color="orange">Explore</v-btn>
</v-card-actions>

我试过native（@click.native="alert(888)" ) 但在这种情况下单击也不起作用。

我错过了什么？

标签： javascriptvue.jsvuetify.js

Answer 1

click 事件的内联处理程序的范围是 Vue 实例，而不是window. alert所以 Vue 正在你的组件上寻找一种方法，但没有找到。

---

只需向您的组件添加一个方法即可调用alert：

methods: {
  onClick() {
    alert(888);
  }
}

然后将其用作点击处理程序：

<v-btn flat color="orange" @click="onClick">Share</v-btn>

---

这是您的 codepen 示例的工作版本。