vue.js 防止扩展头上的按钮触发面板

kd3sttzy 于 2022-12-04 发布在 Vue.js

关注(0)|答案(1)|浏览(97)

我在我的展开面板的标题部分有一个删除按钮。点击删除按钮不应该显示/隐藏展开面板，它是用于对话的。相反，它也会展开面板。我如何防止它展开面板？

<v-expansion-panel-header>
  {{ vehicle.VIN }}

  <v-icon v-if="type == 'saved'" color="teal"> mdi-check </v-icon>
  <v-btn
    text
    class="flex-grow-0"
    v-if="type == 'saved'"
    color="red"
    @click="remove(index, type)"
  >
    DELETE
  </v-btn>
</v-expansion-panel-header>

实时问题：https://jsfiddle.net/bheng/gv1zech7/

vue.js

来源：https://stackoverflow.com/questions/74667074/prevent-button-on-expansion-header-to-trigger-the-panel

1条答案

按热度按时间

fxnxkyjh1#

您应该使用.stop事件修饰词：

<v-btn
    text
    class="flex-grow-0"
    v-if="type == 'saved'"
    color="red"
    @click.stop="remove(index, type)"
  >
    DELETE
  </v-btn>

赞(0）回复(0）举报 2022-12-04

我来回答

vue.js 防止扩展头上的按钮触发面板

1条答案

相关问题

热门标签

最新问答