vue+bootstarp 用for循环遍历出数据,按钮被重复触发

Question

只想触发当前点击按钮,并不想触发全部点击事件,请问怎么解决? 急,在线等<b-card no-body style="background-color:#181b2a;">  <b-tabs pills card>    <b-tab title="你好" active>      <div v-for="(item,index) in ByTicket" :key="index" class="content">        <div class="left">          <div class="d-flex align-items-start">            <div class="crownbg">              <p class="crown text-center">{{index+1}}</p>            </div>            <div class=" flex-column">              <h3>{{item.title}}</h3>              <span class="text-info">{{item.name}}</span>            </div>          </div>        </div>        <b-btn @click="toggle()" class="btn btn-outline-info">查看介绍</b-btn>        <div v-show="isShow">          <p class="card-text text-light">{{item.resume}}</p>          <a href="#">123</a>          <a href="#">123</a>        </div>

Answer 1

使用@click.stop="toggle()"， @click.stop可以阻止单击事件继续传播

建议看看vue的事件修饰符

Answer 2

click 绑定事件处理函数改为：

@click="toggle"

Answer 3

阻止冒泡事件，具体api可参考官网怎么阻止冒泡