在单个 div 上有两个不同的点击事件

Question

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

     <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>

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

Answer 1

是的，您可以使用 Event Modifier。在您的情况下，您正在搜索 @click.stop.

所以你可以这样做：

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

在单个 div 上有两个不同的点击事件

Have two different click events on single div

vue.js

vue-component