Question

我为div和孩子span定义了不同的点击事件：

<div 
  @click.prevent="changeView(value.key)" 
  v-if="value.key != 'Document'" 
  class="panel panel-primary" 
  v-for="(value, key, index) in myList"
>
  <div class="panel-body quote">
    <span 
      @click="removeSection(index,key)" 
      class="pull-right glyphicon glyphicon-remove text-info above"
    ></span>
    <p>{{value.key}}</p>
  </div>
</div>

每次点击父div时，都会打开我期望的部分。每次我点击结束span时，它都会删除我的部分。但是，它也打开了一个我不想要的模态。

我想过尝试在该部分之外定义元素，但我不确定如何。我也尝试使用z-index，但我不知道这是否是一个很好的解决方案。

如何处理点击行为，以便当我点击关闭元素时它不会打开模态？

Answer 1

将.stop modifier添加到@click处理程序以阻止事件传播：

<span @click.stop="removeSection(index,key)" ...>

在子div单击事件上出现意外行为

1 个答案: