vue.js - 在单个 div 上有两个不同的点击事件

Question

我必须执行这样的 div 。当用户点击 时card，它会被重定向到另一个页面，但是当用户点击button里面的card时，它会被重定向到另一个页面。

     <v-ons-card
      @click="goToPage1()"
    >
      <div>
        // content
      </div>

      <div class="card-btn">
        <v-ons-button
          @click="gotopage2()"
        >
          View
        </v-ons-button>
      </div>
    </v-ons-card>

在这个实现中，当我点击按钮时，也会触发卡片点击事件，然后触发按钮点击事件。有什么办法可以防止这种情况吗？

标签： vue.jsvue-component

Answer 1

是的，您可以为此使用事件修饰符。在您的情况下，您正在搜索@click.stop.

因此，您可以执行以下操作：

<v-ons-button @click.stop="gotopage2()">